0

我正在尝试将三级 UL 变成一个易于使用的导航系统。

我的想法是拥有第一个 UL，它是 LI 的显示，但隐藏 UL UL 和 UL UL UL，以及它们各自的 LI。

我希望有人能够单击 LI 顶部，然后在该 LI 中显示 UL。

然后的想法是父 UL 与它的 LI 一起隐藏，但不是我刚刚选择的子 UL。

如果随后单击另一个 LI，则显示该 LI 的子 UL 及其各自的 LI。

效果将只是在任何时候显示一个 UL。

我知道这很复杂，我无法理解如何做到这一点 - 我猜是 CSS 和 jQuery 的组合，我尝试了各种方法并搜索了很多东西，因此我求助于这个。

如果有人对我在说什么以及如何实施它有任何想法，那就太好了，因为我什至不知道从哪里开始。

编辑

我会将 UL 放在固定宽度的 div 内，因此我可以在未使用的 UL 上使用溢出：隐藏和负值来进行“人造隐藏”。

4

1 回答 1

0

这是我在JSFiddle中完成的一个小模型，您只需要采用一些非正统的解决方法来实现这一点。

是的，你需要一些 jQuery 来实现它，我用悬停来做例子，你可以使用你需要的事件，这只是主要的：

$('.subdropdown').hover(
    function() { $(this).parent().parent().css({'visibility': 'hidden'});
    $(this).css({'visibility': 'visible'});},
    function() { $(this).parent().parent().css({'visibility': 'visible'});}
);​

希望这可以帮助。

于 2012-10-31T10:54:12.950 回答