主要使用css的hover伪类来实现该功能。
主要思路:先搭出三级菜单的框架,然后使用css的:hover来实现!
对li添加类selected,对该类添加position:relative属性,然后对其二级三级菜单添加position:absolute属性,并设置其top:-1px(因为有1像素的边框)left:-999px;使其在也页面中向左偏移出窗口。
对li设置:hover伪类,当鼠标指针移动到li上时,改变二级三级菜单的left值,这样就可以实现一个简单的三级导航菜单!
代码如下:
三级导航菜单