大商务悬停菜单

Question

好的，所以我只限于如何在大商业中定制菜单。这是我到目前为止所拥有的，记住一些标签是由系统本身生成的。

在手风琴中显示类别菜单的面板的代码如下所示：

$('.SideCategoryListClassic').children().children('li')
    .hover(function(){
        $(this).children('ul').children().slideDown()
    },
    function(){
        $(this).children('ul').children().slideUp()
    });
$('a[href*="-main"]').attr('href', '#')

还有一个内联样式表。

.SideCategoryListClassic ul li ul li {
    display: none;
}

菜单的生成方式超出了我的能力。我添加的内容之一是HERF替换标记，它禁用主类别上的链接，只让它在子类别上工作。

现在菜单作为一个悬停，但我希望它是一个点击功能菜单。我希望该组在单击时扩展，但如果我单击另一个组，则id希望隐藏前一个组。请记住，我不能修改UL的生成方式，也不能将样式类或id标记分配给它们。在这个页面中，您可以看到菜单的样子：

http://www.d2industries.mybigcommerce.com/about-us/

Answer 1

$('.SideCategoryListClassic').children().children('li').click(function(){
    $('.SideCategoryListClassic').children().children('li').not(this).children('ul').children().slideUp();
    $(this).children('ul').children().slideToggle()
});​

使用.slideToggle()在单击每个菜单时切换其状态。

第一行选择所有属于而不是的菜单，然后将它们向上滑动。第二行切换当前菜单的幻灯片。如果不希望用户再次单击当前打开的菜单，请将slideToggle更改为slideUp。

演示