float menu

<script type="text/javascript">
var startY = 0; /* ตำแหน่งในแนวตั้ง */

function iecompattest()
{
  return (document.compatMode & document.compatMode!="BackCompat")? document.documentElement : document.body
}

function staticbar()
{
  var ns = ( navigator.appName.indexOf( "Netscape" ) != -1 );
  var d = document;
  
  function ml( id )
  {
    var el = d.getElementById( id );
    if( d.layers )
    {
      el.style = el;
    };
    /* ฟังก์ชั่นเพื่อกำหนดตำแหน่ง ในแนวตั้งอย่างเดียว */
    el.sP = function( y )
    {
      this.style.top = y+"px";
    };
    el.y = startY;

    return el;
  }

  window.stayTop = function()
  {
    /* คำนวณตำแหน่งใหม่ตาม scrollbar */
    var pY = ns ? pageYOffset : iecompattest().scrollTop;
    ftlObj.y += ( pY + startY - ftlObj.y ) / 10;
    /* เลื่อน topmenu */
    ftlObj.sP( ftlObj.y );
    /* จับเวลาเพื่อตรวจตำแหน่งครั้งต่อไป */
    setTimeout("stayTop()", 10);
  }
      
  /* เริ่มต้นทำงาน */
   ftlObj = ml( "topbar" );
   stayTop();
}

/* ให้ทำงานตอน load เสร็จ (cross browser) */
if (window.addEventListener )
{
  window.addEventListener( "load" , staticbar , false )
}
else if ( window.attachEvent )
{
  window.attachEvent( "onload" , staticbar )
}
else if ( document.getElementById )
{
  window.onload=staticbar
}
</script>
<style type="text/css">
#topbar {
  width:600px; /* ความกว้างของ topbar */
  margin-left:-300px; /* ครึ่งหนี่งของความกว้างของ topbar */
  position:absolute;
  left:50%;
  
  background-color:silver; /* สีพื้นของ topbar */
  text-align:center; /* ตำแหน่งเมนูภายใน topbar */
}
</style>
<div id="topbar">
  <table><tr>
    <td width="19%"><a href="#" name="link1" id="link1" >TopLink 1</a></td>
    <td width="22%"><a href="#" name="link2" id="link2">TopLink 2</a></td>
    <td width="21%"><a href="#" name="link3" id="link3">TopLink 3</a></td>
    <td width="23%"><a href="#" name="link4" id="link4">TopLink 4</a></td>
    <td width="15%"><a href="#" name="link5" id="link5">TopLink 5</a></td>
  </tr></table>
</div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />