jquery - 菜单关闭时向上滑动多个div

Question

我试图在 JQ 中创建一个菜单，您单击一个链接，它会滑动切换菜单的显示。在菜单中，您可以直接链接到页面，然后展开显示另一个菜单的链接。到目前为止我已经开始工作了:

http://www.eadata.co.uk/testing/test.html#

我现在想做的是，当您单击顶部的链接并且它切换回来时，我需要关闭所有展开的菜单。它目前可以部分工作，并且在切换时只隐藏顶部子菜单。因此，当您将其向下切换时，所有菜单都会关闭。

我一直在努力解决这个问题，但我仍在学习 JQ。 PHP 是我的菜! :)

还有这个菜单，如果鼠标离开菜单区域，它是否可以在设定的时间后切换回来？

Answer 1

首先试试这个(版本 ONE):

给你所有的 nav-level-2 一个类而不是一个 ID(不要忘记你的 CSS)。

$(".nav-level-2").slideUp('slow');

如果这没有帮助，使用这个:

您可以在 jQuery 中使用 $('#nav-container').find('.nav-level-2') 来获取具有此类的所有元素。有了这个，你可以使用这个:

for(var i = 0; i < $('#nav-container').find('.nav-level-2').length; i++) {
    $('#nav-container').find('.nav-level-2').eq(i).slideUp('slow');
}

如果这没有帮助，使用这个:

提供所有 nav-level-2 唯一 ID，并将它们全部存储在一个数组中，然后使用 for 循环关闭所有级别。如果它们是关闭的，它们就不会动画:

var levelarray = new Array('nav-level-2-a', 'nav-level-2-b', 'nav-level-2-c');
for(var i = 0; i < levelarray.length; i++) {
    $('#' + levelarray[i]).slideUp('slow');
}