隐藏菜单（一）-菜单导航特效

文章内容

八 30th, 2009隐藏菜单（一）-菜单导航特效

欢迎光临乱舞春秋网页脚本特效中心，点击运行按钮演示特效：

<br /> 脚本说明:<br /> 把如下代码加入<body>区域中</p> <style> #divMenu {font-family:arial,helvetica; font-size:12pt; font-weight:bold} #divMenu a{text-decoration:none;} #divMenu a:hover{color:red;} </style> <p><script language="JavaScript1.2"></p> <p>ie=document.all?1:0 n=document.layers?1:0</p> <p>lshow=60</p> <p>var move=10;</p> <p>//At what speed (in milliseconds, lower value is more speed) menuSpeed=40</p> <p>//Do you want it to move with the page if the user scroll the page? var moveOnScroll=true var tim; var ltop;</p> <p>//Object constructor function makeMenu(obj,nest){ nest=(!nest) ? '':'document.' nest '.' this.css=(n) ? eval(nest 'document.' obj):eval(obj '.style') this.state=1 this.go=0 this.width=n?this.css.document.width:eval(obj '.offsetWidth') this.left=b_getleft this.obj = obj "Object"; eval(this.obj "=this") } //Get's the top position. function b_getleft(){ var gleft=(n) ? eval(this.css.left):eval(this.css.pixelLeft); return gleft; }</p> <p>function moveMenu(){ if(!oMenu.state){ clearTimeout(tim) mIn() }else{ clearTimeout(tim) mOut() } } //Menu in function mIn(){ if(oMenu.left()>-oMenu.width lshow){ oMenu.go=1 oMenu.css.left=oMenu.left()-move tim=setTimeout("mIn()",menuSpeed) }else{ oMenu.go=0 oMenu.state=1 } } //Menu out function mOut(){ if(oMenu.left()<0){ oMenu.go=1 oMenu.css.left=oMenu.left() move tim=setTimeout("mOut()",menuSpeed) }else{ oMenu.go=0 oMenu.state=0 } } /******************************************************************************** Checking if the page is scrolled, if it is move the menu after ********************************************************************************/ function checkScrolled(){ if(!oMenu.go) oMenu.css.top=eval(scrolled) ltop if(n) setTimeout('checkScrolled()',30) } /******************************************************************************** Inits the page, makes the menu object, moves it to the right place, show it ********************************************************************************/ function menuInit(){ oMenu=new makeMenu('divMenu') scrolled=n?"window.pageYOffset":"document.body.scrollTop" oMenu.css.left=-oMenu.width lshow ltop=(n)?oMenu.css.top:oMenu.css.pixelTop; oMenu.css.visibility='visible' if(moveOnScroll) ie?window.onscroll=checkScrolled:checkScrolled(); }</p> <p>//Initing menu on pageload onload=menuInit; </script></p> <div id="divMenu" style="position:absolute; top:250; left:30; width:200; visibility:hidden; background-color:F0F0F0"> <nobr><br /> <a href="http://www.1stscript.com">网络编程站</a> -<br /> <a href="http://www.163.com">网易</a> -<br /> <a href="http://www.sina.com.cn/">新浪</a> -<br /> <a href="javascript://" onclick="moveMenu()" style="background-color:yellow;text-decoration:none">菜单</a><br /> </nobr> </div> <p><a href="http://www.20blog.cn/Dev/HTML/jsrun/">欢迎访问乱舞春秋网页特效集</a>

20% off Hosting at GoDaddy.com - World's largest Web host!
Domain Sale! $7.49 .com at GoDaddy
声明：本文发表于乱舞春秋(www.20blog.cn),转载请注明出处：http://www.20blog.cn/2009/08/372.html，谢谢！有任何问题请联系QQ37750965

标签: 代码,