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