鼠标点击触发的导航菜单

2024-09-05 12:19:19

字体：大中小

来源：转载

供稿：网友

很不错的仿蓝色理想的一款导航菜单，鼠标点击后触发，菜单项可以扩展，修改方便，结合了JS和CSS技术，值得用一下。

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>鼠标点击触发的导航菜单</title></head><style type="text/css">#dNavBar{background-color:#ffffff;}#dNavBar li{list-style-type:none;float:left;width:90px;height:30px;line-height:30px;font-size:12px;color:#FFFFFF;border:3px solid #ffffff;background-color:#86C2FF;text-align:center;display:block;cursor:pointer;}#subMenu{background-color:#0000FF;width:500px;border-left:3px solid #ffffff;border-right:3px solid #ffffff;height:29px;line-height:29px;color:#FFFFFF;font-size:12px;padding-left:10px;}body {margin-left: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 0px;}a:link {color: #FFFFFF;text-decoration: none;}a:hover{color: #FFFFFF;text-decoration: none;}a:visited{color: #FFFFFF;text-decoration: none;}</style><script language="javascript">function ShowMenu(){var barCTT=document.getElementById("dNavBar")var liArr=barCTT.getElementsByTagName("li")var links=new Array()links[0]="当前位置：首页"links[1]="新闻文章 | 论坛社区 | 聊天留言"links[2]="精品程序 | PHP组件"links[3]="系统相关 | 窗体界面 | 游戏编程"for (i=0;i<liArr.length;i++){liArr[i].onclick=function(){selectThis(this,liArr,links)}}}function selectThis(indexObj,allLi,infoArr){var index=0;for (i=0;i<body onLoad="ShowMenu()"><div id="dNavBar" style="float:none; width:560px;"><li>Home</li><li>ASP</li><li>PHP</li><li>C#</li></div><div id="subMenu">源码下载</div></body></html>

上一篇：Js+DVML很酷的右键动画弹出菜单

下一篇：带图片的下拉式导航菜单

学习交流

如何查找有故障的配件

如何查找有故障的配件...

热门图片

猜你喜欢的新闻

猜你喜欢的关注