Floater


<html>

<body style="background-color: #FFFFDD" onload="setUpFloater()">

<table border id="floater" style="position:absolute;">
  <tr>
    <td><b>[[[ floater ]]]</b></td>
  </tr>
</table>

<script type="text/javascript">
var isDOM, isNS;
var floaterObj, floaterW, floaterH, floaterX, floaterY;
var pageH, pageW, paddingX, paddingY;

function setUpFloater() {
  if (document.getElementById) {
    isDOM = true;
    floaterObj = document.getElementById("floater").style;
  } else {
    isDOM = false;
    floaterObj = document.floater;
  }

  isNS = (navigator.appName == 'Netscape');

  floaterW = 200; floaterH = 135;
  paddingX = 15; paddingY = 15;

  window.onresize = refreshValues
  window.setInterval("placeFloater()", 100);
  refreshValues();
}

function refreshValues() {
  if (isNS) {
    pageH = window.innerHeight - 20;
    pageW = window.innerWidth - 20;
  } else {
    pageH = document.body.clientHeight;
    pageW = document.body.clientWidth;
  }
  floaterX = pageW - floaterW - paddingX;
  floaterY = pageH - floaterH - paddingY;

  placeFloater();
}

function placeFloater() {
  floaterObj.left = floaterX + (isNS ? window.pageXOffset : document.body.scrollLeft);
  floaterObj.top = floaterY + (isNS ? window.pageYOffset : document.body.scrollTop);
}
</script>





<table border width=2000>
  <tr>
    <td>foobar</td>
  </tr>
</table>

<table border height=1000>
  <tr>
    <td>foobar</td>
  </tr>
</table>

</body>
</html>