资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
DIV+CSS设计的动感横向导航
效果图:
演示代码:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>DIV+CSS打造精美导航菜单，sky整理收集。</title> <style> body{ background-color: #000000; } #fbtn{ display:none; overflow:hidden; border-style:solid; border-width:1px; border-color:#e1e1c9 #e1e1c9 #6e6e56 #6e6e56; padding:1 1 1 1; width:115px; height:30px; } #fbtn_txt{ position:relative; } #fbtn_txt div{ height:30px; padding-top:11px; font-size:12px; color:#800080; text-align:center; cursor:hand; } #fbtn_mask{ background-color:#ffffff; position:relative; width:100%; height:100%; } </style> </head> <body> <a href="<#ZC_BLOG_HOST#>">管理资源吧</a>,站长必备的高质量网页特效和广告代码。glzy8.com，站长js特效。<hr> <!--欢迎来到管理资源吧，我们网站收集大量高质量js特效，提供许多广告代码下载，网址：www.glzy8.com，zzjs@msn.com,用.net打造靓站--> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>glzy8.com</div> <div><a href="http://glzy8.com/" _ewebeditor_ta_href="http%3A%2F%2Fglzy8.com%2F">管理资源吧</a></div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>站长特效</div> <div><a href="http://glzy8.com/?cat=1" _ewebeditor_ta_href="http%3A%2F%2Fglzy8.com%2F%3Fcat%3D1">站长特效</a></div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>网页特效</div> <div><a href="http://glzy8.com/?cat=2" _ewebeditor_ta_href="http%3A%2F%2Fglzy8.com%2F%3Fcat%3D2">网页特效</a></div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>广告代码</div> <div><a href="http://glzy8.com/?cat=11" _ewebeditor_ta_href="http%3A%2F%2Fglzy8.com%2F%3Fcat%3D11">广告代码</a></div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>您自定义</div> <div><a href="http://glzy8.com/?cat=2" _ewebeditor_ta_href="http%3A%2F%2Fglzy8.com%2F%3Fcat%3D2">您自定义</a></div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>您自定义</div> <div><a href="http://glzy8.com/?cat=2" _ewebeditor_ta_href="http%3A%2F%2Fglzy8.com%2F%3Fcat%3D2">您自定义</a></div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>您自定义</div> <div><a href="http://glzy8.com/?cat=2" _ewebeditor_ta_href="http%3A%2F%2Fglzy8.com%2F%3Fcat%3D2">您自定义</a></div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>您自定义</div> <div><a href="http://glzy8.com/?cat=2" _ewebeditor_ta_href="http%3A%2F%2Fglzy8.com%2F%3Fcat%3D2">您自定义</a></div> </div> </div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3E%20%0D%0Avar%20current%3Dnull%3B%20%0D%0Avar%20t%3Dnull%3B%20%0D%0Afor(var%20i%3D0%3Bi%3Cfbtn.length%3Bi%2B%2B)%7B%20%0D%0Afbtn_txt%5Bi%5D.style.posTop%3D-30%3B%20%0D%0Afbtn_mask%5Bi%5D.style.posTop%3D-30%3B%20%0D%0Afbtn%5Bi%5D.index%3Di%3B%20%0D%0Afbtn%5Bi%5D.style.display%3D%22block%22%3B%20%0D%0Afbtn%5Bi%5D.onmouseover%3Dfunction()%7B%20%0D%0Aif(!current)%7B%20%0D%0Acurrent%3Dthis%3B%20%0D%0Adomove(this.index)%3B%20%0D%0A%7D%20%0D%0Aelse%20%0D%0Aif(current!%3Dthis)%7B%20%0D%0Adomove(current.index)%3B%20%0D%0Adomove(this.index)%3B%20%0D%0Acurrent%3Dthis%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afbtn%5Bi%5D.onmouseout%3Dfunction()%7B%20%0D%0Aif(event.toElement%3D%3Dthis.parentElement%26t%3D%3Dthis)%7B%20%0D%0Adomove(this.index)%3B%20%0D%0Acurrent%3Dnull%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20domove(num)%7B%20%0D%0Avar%20o%3Dfbtn_txt%5Bnum%5D%3B%20%0D%0Avar%20m%3Dfbtn_mask%5Bnum%5D%3B%20%0D%0Aif(o.style.posTop%3C-60)%7B%20%0D%0Ao.style.display%3D%22none%22%3B%20%0D%0Avar%20t%3Do.children%5B1%5D.innerHTML%3B%20%0D%0Ao.children%5B1%5D.innerHTML%3Do.children%5B0%5D.innerHTML%3B%20%0D%0Ao.children%5B0%5D.innerHTML%3Dt%3B%20%0D%0Ao.style.posTop%3D-30%3B%20%0D%0Ao.style.display%3D%22block%22%3B%20%0D%0Aif(m.style.posTop%3E30)%20%0D%0Am.style.posTop%3D-30%3B%20%0D%0Aelse%20%0D%0Am.style.posTop%3D0%3B%20%0D%0A%7D%20%0D%0Aelse%7B%20%0D%0Am.style.posTop%2B%3D3%3B%20%0D%0Ao.style.posTop-%3D3%3B%20%0D%0AsetTimeout('domove('%2Bnum%2B')'%2C15)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程
