Javascript鼠标滑过显示两级菜单效果

Javascript鼠标滑过显示两级菜单效果
此示例为您分享javascript鼠标滑过显示的两级菜单,供您参考,具体内容如下

1。关键代码:使用开关或判断语句,改变相应的两级菜单显示方式为块或无。
功能selecttabmenu(我){
开关(i){
案例71:
document.getelementbyid(tabmenucon71)。风格。显示为块;
document.getelementbyid(tabmenucon72)。风格。显示为无;
document.getelementbyid(tabmenucon73)。风格。显示为无;
document.getelementbyid(tabmenucon74)。风格。显示为无;
document.getelementbyid(tabmenucon75)。风格。显示为无;
document.getelementbyid(tabmenucon76)。风格。显示为无;
打破;

}
}
2。主导航绑定事件
首页
三.两级菜单
公告
问询处
4。完整的代码

水平导航二级菜单

* {
填料:0px;
保证金:0px;
}
导航栏{。
身高:30px;
背景颜色:# 2b383e;
文本对齐:中心;
}
UL {
列表样式:无;
}
资产净值{ {
浮点数:左;

}
导航李{
显示块;
填充物:0 20px;
身高:30px;
行高:30px;
文字装饰:无;
颜色:# FFF;
}
导航李A:悬停{
背景颜色:# FFF;
颜色:# 4db6e7
}
TabMenuCon {。
清楚:两者;
显示:无;
}
TabMenuCon li {。
显示:内联块;
}
功能selecttabmenu(我){
开关(i){
案例71:
document.getelementbyid(tabmenucon71)。风格。显示为块;
document.getelementbyid(tabmenucon72)。风格。显示为无;
document.getelementbyid(tabmenucon73)。风格。显示为无;
document.getelementbyid(tabmenucon74)。风格。显示为无;
document.getelementbyid(tabmenucon75)。风格。显示为无;
document.getelementbyid(tabmenucon76)。风格。显示为无;
打破;
案例72:
document.getelementbyid(tabmenucon71)。风格。显示为无;
document.getelementbyid(tabmenucon72)。风格。显示为块;
document.getelementbyid(tabmenucon73)。风格。显示为无;
document.getelementbyid(tabmenucon74)。风格。显示为无;
document.getelementbyid(tabmenucon75)。风格。显示为无;
document.getelementbyid(tabmenucon76)。风格。显示为无;
打破;
案例73:
document.getelementbyid(tabmenucon71)。风格。显示为无;
document.getelementbyid(tabmenucon72)。风格。显示为无;
document.getelementbyid(tabmenucon73)。风格。显示为块;
document.getelementbyid(tabmenucon74)。风格。显示为无;
document.getelementbyid(tabmenucon75)。风格。显示为无;
document.getelementbyid(tabmenucon76)。风格。显示为无;
打破;
案例74:
document.getelementbyid(tabmenucon71)。风格。显示为无;
document.getelementbyid(tabmenucon72)。风格。显示为无;
document.getelementbyid(tabmenucon73)。风格。显示为无;
document.getelementbyid(tabmenucon74)。风格。显示为块;
document.getelementbyid(tabmenucon75)。风格。显示为无;
document.getelementbyid(tabmenucon76)。风格。显示为无;
打破;
案例75:
document.getelementbyid(tabmenucon71)。风格。显示为无;
document.getelementbyid(tabmenucon72)。风格。显示为无;
document.getelementbyid(tabmenucon73)。风格。显示为无;
document.getelementbyid(tabmenucon74)。风格。显示为无;
document.getelementbyid(tabmenucon75)。风格。显示为块;
document.getelementbyid(tabmenucon76)。风格。显示为无;
打破;
案例76:
document.getelementbyid(tabmenucon71)。风格。显示为无;
document.getelementbyid(tabmenucon72)。风格。显示为无;
document.getelementbyid(tabmenucon73)。风格。显示为无;
document.getelementbyid(tabmenucon74)。风格。显示为无;
document.getelementbyid(tabmenucon75)。风格。显示为无;
document.getelementbyid(tabmenucon76)。风格。显示为块;
打破;
}
}
首页
关于协会
协会动态
协会的活动
成员
资源空间
通知
信息
协会简介
组织
协会章程
协会的新闻
活动预览
工作
义务维修月
平面设计活动
程序设计活动
户外拓展
会员登录
会员注册
交纳会费
会员信息管理
修改密码
PS教程
前端设计
Flash教程
以上是本文的全部内容,希望能对大家有所帮助。
免责声明:本网信息来自于互联网,目的在于传递更多信息,并不代表本网赞同其观点。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,并请自行核实相关内容。本站不承担此类作品侵权行为的直接责任及连带责任。如若本网有任何内容侵犯您的权益,请及时联系我们,本站将会在24小时内处理完毕。
相关文章
返回顶部