基于JS代码实现导航条弹出式悬浮菜单

为隐藏。在JavaScript中，控制此

显示的写法如下：

document.getElementById("mydiv").style.display="block"; 

3.具体实现

（1）编写用于显示和隐藏的JavaScript方法，当鼠标经过一级菜单标题时会显示二级菜单，当鼠标移出时会隐藏二级菜单。关键代码如下：

function change(img,subMenu,path,type){
img.src="images/"+path+".GIF";
if(subMenu!=null){
if(type==0){
subMenu.style.display="none";
}else{
subMenu.style.display="block";
}
}
} 

（2）在页面中，预先在

标签中为每个一级导航菜单添加二级菜单的内容，并设置二级菜单的

标签为隐藏。关键代码如下：

浏览员工信息  添加新员工



...//此处省略了其他二级菜单的
内容 

（3）在一级菜单的的表格的中设置onMouseOver和onMouseOut事件，调用步骤（1）中定义的JavaScript的change()方法用js实现动态的导航条，动态改变二级菜单

的显示和隐藏。关键代码如下：

...//省略了二级菜单的
代码

以上所述是小编给大家介绍的导航条弹出式悬浮菜单用js实现动态的导航条，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)