JS浮动导航菜单,始终显示在指定位置
JS浮动导航菜单,始终显示在网页中的指定位置、或者说是高度,滚动你网页的滚动条,它会跟着网页自动滚动至原位置,类似单幅对联广告的效果,菜单没有怎么美化,有需要的朋友可根据你自己的网页风格自行美化。
JS浮动导航菜单,始终显示在网页中的指定位置、或者说是高度,滚动你网页的滚动条,它会跟着网页自动滚动至原位置,类似单幅对联广告的效果,菜单没有怎么美化,有需要的朋友可根据你自己的网页风格自行美化。
答案:<title>JS浮动导航菜单</title>
<style TYPE="text/css">
<!--
.menuh {
BORDER-COLOR : #FFFF99 ;
cursor : hand ;
Border-Left : #FFFF99 ;
Border-Top : #FFFF99 ;
Padding-Left : 1px ;
Padding-Top : 1px ;
Background-Color : #FFFF99 ;
}
.menu {
Background-Color : white ;
}
.home {
cursor : hand ;
}
.menulinks{
text-decoration:none;
}
//-->
</style>
<script Language="Javascript">
<!--
var menuwidth=110
var offsetleft=10
var offsettop=90
var ns4=document.layers?1:0
var ie4=document.all?1:0
var ns6=document.getElementById&&!document.all?1:0
function makeStatic() {
if (ie4) {object1.style.pixelTop=document.body.scrollTop+offsettop}
else if (ns6) {document.getElementById("object1").style.top=window.pageYOffset+offsettop}
else if (ns4) {eval(document.object1.top=eval(window.pageYOffset+offsettop));}
setTimeout("makeStatic()",0);
}
if (ie4||ns6) {document.write('<span ALIGN="CENTER" ID="object1" STYLE="Position:absolute; Top:20; Left:'+offsetleft+'; Z-Index:5;cursor:hand;background-color:black;"><TABLE BORDER="1" width="'+menuwidth+'" CELLPADDING="0" CELLSPACING="0" BORDERCOLOR="black" bgcolor="white">')}
else if (ns4){ document.write('<LAYER top="20" name="object1" left="'+offsetleft+'" BGCOLOR=black><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="1"><TR><TD><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" width="'+menuwidth+'">')}
if (ie4||ns6||ns4)
document.write('<TR><TD BGCOLOR="#3399FF" BORDERCOLORDARK="#99CCFF" BORDERCOLORLIGHT="#003399"><P ALIGN=CENTER><FONT SIZE="4" FACE=ARIAL>Menu</FONT></TD></TR>')
var menui = new Array();
var menul = new Array();
menui[0]="资源首页";
menui[1]="有啊";
menui[2]="浏览最新";
menui[3]="源码排行";
menui[4]="AJAX";
menui[5]="网站留言";
menui[6]="友情链接";
menui[7]="网站首页";
menul[0]="/";
menul[1]="http://www.youa.com";
menul[2]="/jscss/";
menul[3]="/";
menul[4]="/sort/index.shtml";
menul[5]="/guestbook/";
menul[6]="/service/links.shtml";
menul[7]="/index.html";
for (i=0;i<=menui.length-1;i++)
if (ie4||ns6) {document.write('<TR><TD BORDERCOLOR="white" ONCLICK="location=\''+menul[i]+'\'" onmouseover="className=\'menuh\'" onMouseout="className=\'menu\'"><CENTER><FONT>'+menui[i]+'</FONT></TD></TR>')}
else if (ns4){document.write('<TR><TD BGCOLOR="white"><ILAYER><LAYER width="'+menuwidth+'" onmouseover="bgColor=\'yellow\'" onmouseout="bgColor=\'white\'"><CENTER><A HREF="'+menul[i]+'" class=menulinks>'+menui[i]+'</A></CENTER></LAYER></ILAYER></TD></TR>')}
if (ie4||ns6) {document.write('</TABLE></span>')}
else if (ns4){document.write('</TABLE></TD></TR></TABLE></LAYER>')}
function menu3(){
if (ns6||ie4||ns4)
makeStatic()
}
window.onload=menu3
//-->
</script>
上一个:在网页右上角隐藏的滑出菜单
下一个:CSS经典Tab滑动门菜单