资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
js 下拉菜单实现代码
<!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=gb2312" /> <title> </title> <meta name="description" content=" "> <meta name="keywords" content=" "> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <style type="text/css"> *{padding:0;margin:0;} .nav{width:850px;margin:50px auto;position:relative;} .nav li{display:inline;margin-right:50px;} .nav ol{background-color:#f5f5f5;border:1px solid #ccc;display:none;padding:15px;} .nav ol li{display:block;margin-bottom:15px;} </style> <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%0D%0Avar%20next%3Dfunction%20(el)%20%7B%20%0D%0Ado%20%7B%20%0D%0Ael%20%3D%20el.nextSibling%3B%20%0D%0A%7D%20while%20(%20el%20%26%26%20el.nodeType%20!%3D%201%20)%3B%20%0D%0Areturn%20el%3B%20%0D%0A%7D%20%0D%0Avar%20showContent%3Dfunction%20(el)%20%7B%20%0D%0Avar%20_next%3Dnext(el)%3B%20%0D%0A_next.style.display%3D%22block%22%3B%20%0D%0A_next.style.position%3D%22absolute%22%3B%20%0D%0A_next.style.zIndex%3D%22999%22%3B%20%0D%0A_next.style.top%3Del.offsetHeight%2Bel.offsetTop%2B%22px%22%3B%20%0D%0A_next.style.left%3Del.offsetLeft%2B%22px%22%3B%20%0D%0A_next.onmouseout%3Dfunction%20()%7B%20%0D%0Athis.style.display%3D%22none%22%3B%20%0D%0A%7D%20%0D%0A_next.onmouseover%3D_next.onmousemove%3Dfunction%20()%7B%20%0D%0Athis.style.display%3D%22block%22%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Avar%20hideContent%3Dfunction%20(el)%20%7B%20%0D%0Ael.style.display%3D%22none%22%3B%20%0D%0A%7D%20%0D%0A%0D%0A%3C%2Fscript%3E"> </head> <body> <!--页眉开始--> <div class="nav"> <ul> <li> <a href="###" _ewebeditor_ta_href="%23%23%23" onmouseover="showContent(this);" onmouseout="hideContent(next(this));" >首页</a> <ol> <li><a href="###" _ewebeditor_ta_href="%23%23%23">首页1</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">首页2</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">首页3</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">首页4</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">首页4</a></li> </ol> </li> <li> <a href="###" _ewebeditor_ta_href="%23%23%23" onmouseover="showContent(this);" onmouseout="hideContent(next(this));" >电影</a> <ol> <li><a href="###" _ewebeditor_ta_href="%23%23%23">电影1</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">电影2</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">电影3</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">电影4</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">电影4</a></li> </ol> </li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">新闻</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">新片</a></li> <li><a href="###" _ewebeditor_ta_href="%23%23%23">排行榜</a></li> </ul> </div> dcxsssssssss <!--页眉结束--> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程