更新时间:2022-12-03 12:03:36
您需要稍微更改jQuery脚本以适应这样的多级菜单:
You need to change the jQuery script a little to accommodate for the multilevel menus like this:
$('ul#menu li').hover(function(){
$(this).children('ul').delay(20).slideDown(200);
}, function(){
$(this).children('ul').delay(20).slideUp(200);
});
并像这样更改html:
and change html like this:
<ul id="menu">
<li><a href="#">Home</a>
<ul class="drop">
<li><a href="#">About us</a></li>
<li><a href="#">About us</a></li>
<li><a href="#">About us</a></li>
<li>
<a href="#">About us</a>
<ul>
<li><a href="#">Sub Item 1</a></li>
<li>
<a href="#">Sub Item 2</a>
<ul>
<li><a href="#">Sub item 3</a></li>
<li><a href="#">Sub item 4</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li><a href="#">about</a>
<ul class="drop">
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
</ul>
</li>
</ul>
您的CSS没问题. 您可以在以下位置查看更新的多级代码: http://jsfiddle.net/297t6/
Your css is fine. You can check the updated multilevel code at: http://jsfiddle.net/297t6/