全部,
我是 JQuery 的新手,正在尝试编写 JQuery 代码来创建多级下拉菜单。 HTML 如下所示:
<ul id="menu">
<li><a href="#">Link 1</a>
<ul class="submenu">
<li><a href="#">Sub Link 1.1</a>
<ul class="submenu">
<li><a href="#"> Sub Link 1.1.1</a></li>
<li><a href="#"> Sub Link 1.1.2</a></li>
</ul>
</li>
<li><a href="#">Sub Link 1.2</a></li>
<li><a href="#">Sub Link 1.3</a></li>
</ul>
</li>
<li><a href="#">Link 2</a>
<ul class="submenu">
<li><a href="#">Sub Link 2.1</a>
<ul class="submenu">
<li><a href="#"> Sub Link 2.1.1</a></li>
<li><a href="#"> Sub Link 2.1.2</a></li>
</ul>
</li>
<li><a href="#">Sub Link 2.2</a></li>
</ul>
</li>
</ul>
目前我得到的 JQuery 代码如下,但它没有打开和关闭子菜单。我怎样才能让它工作?
$(document).ready(function () {
$('#ul.menu > li').hover(function () { $('ul:first', this).show(); },
function () { $('ul:first', this).hide(); }
);
$('#ul.menu li li').hover(function () {
$('ul:first', this).each(function () {
var p = $(this).parent();
$(this).css('top', p.position().top)
.css('left', p.position().left + p.width())
.show();
});},
function () { $('ul:first', this).hide(); }
);
});
最佳答案
看看这个:http://jsfiddle.net/g5xSX/ , 也许这正是你想要的
关于javascript - 多级下拉导航菜单的jquery代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6623179/