📄 0015.htm
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><!-- saved from url=(0032)http://www.ie-zone.com/index.php --><HTML><!-- #BeginTemplate "/Templates/JsExample.dwt" --><HEAD><!-- #BeginEditable "doctitle" --> <TITLE>滑动的导航条之四</TITLE><!-- #EndEditable --><META http-equiv=Content-Type content="text/html; charset=gb2312"><LINK href="../fav.ico" rel="shortcut icon"><STYLE type=text/css>BODY { MARGIN: 25px 25px 25px}#all TD { FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"}INPUT { FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"}SELECT { FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"}P { FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"}TEXTAREA { FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"}#all A:active { COLOR: #7d070c}#all A:visited { COLOR: #7d070c}#all A:hover { COLOR: #336699}#all A:link { COLOR: #7d070c}</STYLE><SCRIPT language=JavaScript><!--function MM_goToURL() { //v3.0 var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");}function JM_cc(ob){ob.select();js=ob.createTextRange();js.execCommand("Copy");}//--></SCRIPT><META content="MSHTML 5.50.4134.600" name=GENERATOR></HEAD><BODY id=all text=#000000 bgColor=#336699><TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TR bgColor=#ffffff> <TD><IMG src="../images/sq_1.gif" width=11 height="14"></TD> <TD width="100%"></TD> <TD><IMG src="../images/sq_2.gif" width=11 height="14"></TD> </TR></TABLE><!-- #BeginEditable "Example%20and%20Sources" --> <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TR bgColor=#ffffff> <TD><IMG src="../images/space.gif" width=11 height="1"></TD> <TD width="100%"> <table width="100%" border="0" cellpadding="8"> <tr> <td align="center"><!-- #BeginLibraryItem "/Library/js_title.lbi" --><script language="JavaScript">document.write("<font color=#7d070c style=\"font-size: 14px\">"+document.title+"</font>");</script><!-- #EndLibraryItem --></td> </tr> <tr> <td bgcolor="#f7f7f7"> 提示：横向导航条，试试点击Menu. <style>#divMenu {font-family:arial,helvetica; font-size:12pt; font-weight:bold}#divMenu a{text-decoration:none;}#divMenu a:hover{color:red;}</style> <script language="JavaScript1.2">/********************************************************************************Submitted with modifications by Jack Routledge (http://fastway.to/compute) to DynamicDrive.comCopyright (C) 1999 Thomas Brattli @ www.bratta.comThis script is made by and copyrighted to Thomas Brattli This may be used freely as long as this msg is intact!This script has been featured on http://www.dynamicdrive.com********************************************************************************Browsercheck:*/ie=document.all?1:0n=document.layers?1:0//These are the variables you have to set://How much of the layer do you wan't to be visible when it's in the out state?lshow=60//How many pixels should it move every step? var move=10;//At what speed (in milliseconds, lower value is more speed)menuSpeed=40//Do you want it to move with the page if the user scroll the page?var moveOnScroll=true/********************************************************************************You should't have to change anything below this.********************************************************************************///Defining variablesvar tim;var ltop;//Object constructorfunction 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;}/********************************************************************************Deciding what way to move the menu (this is called onmouseover, onmouseout or onclick)********************************************************************************/function moveMenu(){ if(!oMenu.state){ clearTimeout(tim) mIn() }else{ clearTimeout(tim) mOut() }}//Menu infunction 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 outfunction 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();}//Initing menu on pageloadonload=menuInit;</script> <div id="divMenu" style="position:absolute; top:250; left:30; width:200; visibility:hidden; background-color:F0F0F0"> <nobr> <a href="../../../www.dynamicdrive.com/index.html">Dynamic Drive</a> - <a href="../../../www.freewarejava.com/cgi-bin/Ultimate.cgi">WA Help Forum</a> - <a href="../../../active-x.com/index.html">Active-X.com</a> - <a href="javascript://" onClick="moveMenu()" style="background-color:yellow;text-decoration:none">MENU</a> </nobr> </div> </td> </tr> <tr> <td> <p>1.将下面的代码复制到 <head> <input type="button" name="Button" value="复制到我的剪贴板" onClick=JM_cc(js_1)> <br> <textarea name="js_1" wrap="VIRTUAL" cols="80" rows="10"><style>#divMenu {font-family:arial,helvetica; font-size:12pt; font-weight:bold}#divMenu a{text-decoration:none;}#divMenu a:hover{color:red;}</style> <script language="JavaScript1.2">/********************************************************************************Submitted with modifications by Jack Routledge (http://fastway.to/compute) to DynamicDrive.comCopyright (C) 1999 Thomas Brattli @ www.bratta.comThis script is made by and copyrighted to Thomas Brattli This may be used freely as long as this msg is intact!This script has been featured on http://www.dynamicdrive.com********************************************************************************Browsercheck:*/ie=document.all?1:0n=document.layers?1:0//These are the variables you have to set://How much of the layer do you wan't to be visible when it's in the out state?lshow=60//How many pixels should it move every step? var move=10;//At what speed (in milliseconds, lower value is more speed)menuSpeed=40//Do you want it to move with the page if the user scroll the page?var moveOnScroll=true/********************************************************************************You should't have to change anything below this.********************************************************************************///Defining variablesvar tim;var ltop;//Object constructorfunction 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;}/********************************************************************************Deciding what way to move the menu (this is called onmouseover, onmouseout or onclick)********************************************************************************/function moveMenu(){ if(!oMenu.state){ clearTimeout(tim) mIn() }else{ clearTimeout(tim) mOut() }}//Menu infunction 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 outfunction 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();}//Initing menu on pageloadonload=menuInit;</script> </textarea> <br> <br> <p>2.复制下面代码到<body>后<br> <div id="divMenu" style="position:absolute; top:250; left:30; width:200; visibility:hidden; background-color:F0F0F0"> <br> <nobr> <a href="http://www.dynamicdrive.com">Dynamic Drive</a> - <br> <a href="http://www.freewarejava.com/cgi-bin/Ultimate.cgi">WA Help <br> Forum</a> - <a href="http://active-x.com/">Active-X.com</a> - <a href="javascript://" onClick="moveMenu()" style="background-color:yellow;text-decoration:none">MENU</a> <br> </nobr> </div><br> <br> <font color="#990000">有没有注意到这段代码？没错了导航条的内容就在这里，修改这段代码就可以了.</font></p> </table> <TD><IMG src="../images/space.gif" width=11 height="1"></TD> </TABLE><!-- #EndEditable --><TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TR bgColor=#ffffff> <TD><IMG src="../images/sq_3.gif" width=11 height="14"></TD> <TD width="100%"></TD> <TD><IMG src="../images/sq_4.gif" width=11 height="14"></TD> </TR></TABLE></BODY><!-- #EndTemplate --></HTML>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -