Description
Keeps a <div> static on your page.
Demonstration
See above.
Code
<head> <style type="text/css"> #floating { color: black; background-color: #eeeeee; font-family: verdana, arial; font-size: 14px; border: 1px solid; position: absolute; left: 0px; top: 0px; width: 100%; height: 25px; z-index: 1; } </style> <script language="javascript" type="text/javascript"> function setvars() { x = 0; if (document.layers) { //NS 4.x doc="document."; stl=""; tp=".top="; toppos="window.pageYOffset"; } else { if (document.all) { // IE, Opera doc=""; stl=".style"; tp=".pixelTop="; toppos="document.body.scrollTop"; } else { if (document.getElementById) { //NN7, Mozilla doc="document.getElementById('"; stl = "').style.position='fixed'"; tp = ""; toppos = ""; x = 1; } } } } function movemenu() { divid="floating"; if (document.getElementById && x == 1) { eval(doc+divid+stl); } else { currentpos=eval(toppos); //alert (doc+divid+stl+tp+currentpos); eval(doc+divid+stl+tp+currentpos); setTimeout("movemenu()",10); } } </script> </head> <body onLoad="setvars();movemenu()"> <div id="floating"> Your menu goes here .... </div>
Tested in: IE6, Opera 7, NN4.7, NN7, and Mozilla 1.2.
Works in: IE6, Opera 7, NN4.7, NN7, and Mozilla 1.2.
Doesn't work in: NA
Programmed to take advantage of Netscape and Mozilla's correct support of the CSS2 property position: fixed.
Copyright© 2003, Infinity Web Design