给大家一个都不陌生的导航样式,老版的QQ菜单样式,网上找了一些代码,但觉得很复杂,想用起来又不方便,于是自己动手写了一个简单的,除了没有写缓慢展开的效果外,其余的都应该差不多,相信很多地方都能用上。
功能如下:
1、初始状态下,所以菜单呈关闭状态,当点击某一个菜单时,就展开此菜单,展示里面的内容
2、当点击另外一个菜单时,前一个菜单关闭,展开新点击的菜单,展示里面的内容
3、浏览器窗口大小改变时,展开的菜单会对应于你的浏览器大小而拉伸或压缩
4、当浏览器窗口高度过小(即刷新浏览器出现上下滚动)时,报错提醒,(相信设置导航时会考虑到大体性,即不要把分类分得太多)
最后,用到的样式表都只是为了体现功能效果,没有细设,至于鼠标移动和其它样式,自己稍做修改就可达到你想要的效果
再看看下面例子的效果:
相关下载:
css下载:QQmenu.css
js下载:QQmenu.js