资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
滑动门式菜单 实现代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>自写的滑动门式菜单/</title> <style type="text/css"> *{margin:0;padding:0;} body{ margin:auto;font:14px "宋体",Verdana, Arial, Helvetica, sans-serif;color:#333;} ul,li{padding:0; list-style:none;} a:link,a:visited{color:#333;text-decoration:none;} a:hover{color:#d00;text-decoration:none;} #headNav{background:url(http://files.glzy8.com/imgby/_navBg.png) 0 -42px repeat-x; border-top:solid 1px #E5B0B1; height:42px;} #headNav ul li{float:left; padding:13px 0; text-align:center; cursor:pointer; } #headNav ul li a{display:block; font-size:14px; padding:0 9px; font-weight:bold; color:#fff;} #headNav ul li a.lineLink{border-left:dotted 1px #fff;} .navNormalLink{background:url(http://files.glzy8.com/imgby/_navBg.png) 0 -42px no-repeat; padding-bottom:4px;} .navNormalOver{background:url(http://files.glzy8.com/imgby/_navBg.png) no-repeat; padding-bottom:4px;} </style> </head> <body> <div id="headNav"> <ul> <li><a href="http://www.glzy8.com" _ewebeditor_ta_href="http%3A%2F%2Fwww.glzy8.com" title="">管理资源吧</a></li> <li><a href="#" _ewebeditor_ta_href="%23" title="">行业资讯</a></li> <li><a href="#" _ewebeditor_ta_href="%23" title="">搜索引擎</a></li> <li><a href="#" _ewebeditor_ta_href="%23" title="">站长访谈</a></li> <li><a href="#" _ewebeditor_ta_href="%23" title="">网站联盟</a></li> <li><a href="#" _ewebeditor_ta_href="%23" title="">源码下载</a></li> <li><a href="#" _ewebeditor_ta_href="%23" title="">网页特效</a></li> <li><a href="#" _ewebeditor_ta_href="%23" title="">模板素材</a></li> <li><a href="#" _ewebeditor_ta_href="%23" title="">软件下载</a></li> </ul> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0A%20%20%20%20%20%20%20%20%3C!--%20%0D%0A%20%20%20%20%20%20%20%20var%20globalNavSelectedIndex%3D2%3B%2F%2F%E5%BD%93%E5%89%8D%E5%AF%BC%E8%88%AA%E9%80%89%E4%B8%AD%20%0D%0A%20%20%20%20%20%20%20%20var%20oSel%3Ddocument.getElementById(%22headNav%22).getElementsByTagName(%22a%22)%3B%20%0D%0A%20%20%20%20%20%20%20%20var%20oLi%3Ddocument.getElementById(%22headNav%22).getElementsByTagName(%22li%22)%3B%20%0D%0A%20%20%20%20%20%20%20%20for(var%20i%3D0%3Bi%3CoSel.length%3Bi%2B%2B)%20%0D%0A%20%20%20%20%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20if(i!%3D0)%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20oSel%5Bi%5D.className%3D%22lineLink%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20if(globalNavSelectedIndex%3D%3Di)%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20oLi%5Bi%5D.className%3D%22navNormalOver%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7Delse%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20oLi%5Bi%5D.className%3D%22navNormalLink%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20for(var%20i%3D0%3Bi%3CoLi.length%3Bi%2B%2B)%20%0D%0A%20%20%20%20%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%E5%88%87%E6%8D%A2%E6%BB%91%E5%8A%A8%E9%97%A8%20%0D%0A%2F%2F%20%20%20%20%20%20%20%20%20%20%20%20if(window.attatchEvent)%7B%20%0D%0A%2F%2F%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20oLi%5Bi%5D.attatchEvent(%22onmouseover%22%2CSwitchNav(i))%3B%20%0D%0A%2F%2F%20%20%20%20%20%20%20%20%20%20%20%20%7Delse%20if(window.addEventListener)%7B%20%0D%0A%2F%2F%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20oLi%5Bi%5D.addEventListener(%22mouseover%22%2CSwitchNav(i)%2Cfalse)%3B%2F%2F%E6%AD%A4%E5%A4%84%E8%AF%B7%E9%AB%98%E6%89%8B%E6%8C%87%E7%82%B9%EF%BC%8C%E8%B0%A2%E8%B0%A2%E3%80%82%20%0D%0A%2F%2F%20%20%20%20%20%20%20%20%20%20%20%20%7Delse%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20(function(i)%7BoLi%5Bi%5D.onmouseover%3Dfunction()%7BSwitchNav(i)%7D%7D)(i)%3B%20%0D%0A%2F%2F%20%20%20%20%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20%2F%2F%E5%88%87%E6%8D%A2%E6%BB%91%E5%8A%A8%E9%97%A8%20%0D%0A%20%20%20%20%20%20%20%20function%20SwitchNav(arg)%20%0D%0A%20%20%20%20%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20for(var%20i%3D0%3Bi%3CoLi.length%3Bi%2B%2B)%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if(arg%3D%3Di)%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20oLi%5Bi%5D.className%3D%22navNormalOver%22%3B%2F%2F%E6%BB%91%E8%BF%87%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7Delse%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20oLi%5Bi%5D.className%3D%22navNormalLink%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20oLi%5BglobalNavSelectedIndex%5D.className%3D%22navNormalOver%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20%2F%2F--%3E%20%0D%0A%20%20%20%20%20%20%20%20%3C%2Fscript%3E"> </div> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程