码迷,mamicode.com
首页 > Web开发 > 详细

js应用例子—导航栏子菜单

时间:2017-12-09 20:59:39      阅读:205      评论:0      收藏:0      [点我收藏+]

标签:var   用例   document   导航   length   div   bsp   use   auto   

*{ margin:0px auto; padding:0px;}先做出5个导航栏。每个导航栏下面做个DIV。这个div宽度高度设置为0.在套一个div。这里面做子菜单,然后把子菜单移动到每个导航栏下面

(用relative定位),设置隐藏,display:none;

给每个导航栏做鼠标移上事件。var menu=document.getElementsByClassname("menu");

for( i=0;i<menu.length;i++){ menu[i].onmouseover=function(){ this.nextSibling.nextSibling.style.display="block"}}

for( i=0;i<menu.length;i++){ menu[i].onmouseout=function(){ this.nextSibling.nextSibling.style.display="none"}}

找当前菜单用this,当前菜单子菜单this.nextSibling

 

js应用例子—导航栏子菜单

标签:var   用例   document   导航   length   div   bsp   use   auto   

原文地址:http://www.cnblogs.com/forqiwen/p/8012512.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!