javascript - 多级水平菜单 CSS

Question

我需要创建一个水平菜单，它跨越 3 个层次(顶部导航、子导航、子子导航)。

我找到了例子，比如这个 CodePen跨越 2 个级别，但我的 Jquery 不够强大，无法完成第三个级别。

$(function() {
$('li a').click(function(e) {
    e.preventDefault();
    var $this = $(this);
    $this.closest('ul').children('li').removeClass('active');
    $this.parent().addClass('active');
    });
});

Top Nav 和 Sub Nav 始终可见，但是，只有在单击 Sub nav 时才需要显示 SubSub Nav。

我还有另一个 Unresolved 问题，关于使我的现有代码与 JQuery 1.8.2 兼容，但如果不是这样，我希望能够在纯 CSS 中做到这一点。这是我当前菜单的代码 JsFiddle .

有没有人有不涉及下拉菜单的多级菜单系统的示例？我想做的基本事情是在网站上显示用户的事件进度，因此它更像是一种视觉辅助而不是菜单，但如果需要，它可以单击以导航到前面的部分。

Answer 1

这里是纯css链接，大家可以试试! http://www.cssscript.com/create-a-multi-level-drop-down-menu-with-pure-css/