0

我正在开发一个站点，其中主导航中的某些链接具有单独的子菜单 - 没有什么不寻常的。

但是，我试图控制子菜单的可见性。当光标悬停在带有子菜单的链接上时，子菜单应该向下滑动。如果光标移动并悬停在另一个子菜单的不同链接上，应该会发生相同的效果，但我试图在向下滑动新请求的子菜单之前隐藏任何打开的子菜单。

我正在使用以下代码：

jQuery(document).ready(
    function(){
        jQuery('div#block-system-main-menu div.content ul li.leaf').mouseover(
            function(){
                //jQuery('div.view-referenced-product-categories').slideUp();
                jQuery(this).find('div.view h3').slideDown();
            }
        );
    }
);

使用该代码，我的下拉菜单可以正常工作，但最终会打开多个子菜单。如果我在 mouseover 函数中取消注释第一行代码，我的滑动效果将不起作用。

为了说明，该站点位于http://hoffmann-koree.com/。带有子菜单的 2 个链接是浴室和固定。

谁能告诉我我做错了什么或者更好的技术？

4

2 回答 2

0

为什么不只使用mouseleave？

jQuery('div#block-system-main-menu div.content ul li.leaf').mouseover(
    function(){
        jQuery(this).find('div.view h3').slideDown();
    }
);
jQuery('div#block-system-main-menu div.content ul li.leaf').mouseleave(
    function(){
        jQuery(this).find('div.view h3').slideUp();
    }
);

我检查了你的源代码，如果你想添加它，只需编辑你的 hoffmannkoree.js 并将第 4-16 行替换为上面的代码片段。

于 2012-07-04T05:02:04.110 回答
0

slideDown()尝试将slideUp()

var menu = this;
jQuery('div.view-referenced-product-categories').slideUp(500, function (){
    jQuery(menu).find('div.view h3').slideDown();
});

这样，slideDown()只会在slideUp()完成时调用。（我为速度设置了 500 毫秒，因为它是默认设置，但如果您设置更快的速度来隐藏菜单，可能会更好）

于 2012-04-30T15:10:51.167 回答