Peter: dynamische Positionierung

Hallo,
ich möchte bei einem Text einen Link hinterlegen, so dass beim Klicken ein kleines Popupfenster aufgeht.
Wie kann ich erreichen, dass das Fenster wenn der  Link am Rand steht nicht außerhalb des sichtbaren Fensterbereichs aufgeht?
Das Popup sollte abhängig von der Position entweder rechts oder links neben dem Link aufgehen.

Hier meine bisherigen Ideen

<html>
<head>

<script>
function showHideDiv(obj)
{
 //alert('obj.style.display: ' + obj.style.display);
 //var obj = document.getElementByID(id);

if (!obj) return;

if (obj.style.display == 'none')
 {
  obj.style.display = 'block';
 }
 else
 {
  obj.style.display = 'none';
 }
}
</script>

</head>
<body>
Ich möchte die Möglichkeit in einem
<span onClick="showHideDiv(document.getElementById('Pop0'))"><u>Popupfenster</u></span>
<span style="display: none">When the hotspot is clicked, the pop-up would then provide additional information.  </span>

<span id="Pop0" style="position:absolute; width:250; z-index:1; display: none; overflow: auto;">
 <span align="right">
 <table width="100%" height="100%" border="1px" bordercolor="#E7AB09" valign="top" align="left" cellpadding="5" cellspacing="0">
  <tr>
   <td bgcolor="#FCFBAA" valign="top">
    <table width="100%">
    <tr><td align="left"><span class="popUpDivLeft"><font color="#000000"><b></b></font></span></td>
     <td align="right"><span onClick="showHideDiv(document.getElementById('Pop0'))">Close</td>
    </tr>
    <tr>
     <td align="left" colspan="2">
     <span style="font-size: 8pt; font-family: Verdana, Arial, Helvetica, sans-serif; color: #000000; text-align: left">When the hotspot is clicked, the pop-up would then provide additional information.  </span>
     </td>
    </tr>
    </table>
   </td>
  </tr>
 </table>
 </span>
</span>
zusätzliche Informationen zu haben.
Dabei soll das Popupfenster relativ zum Text ausgerichtet werden.
Vor allem soll das Popupfenster nicht außerhalb des Fenster aufgehen

</body>
</html>