Question

我正在尝试制作一个菜单，它会长时间保持打开状态，如果父母或菜单在一段时间内没有悬停，则会消失。

如果你在菜单中突出显示另一个父母，那么它的想法就是关闭除了你已经在的父母以外的所有其他菜单。它所代表的代码可以打开所有菜单，而不是关闭除了突出显示的所有菜单之外的所有菜单

菜单

$text .=            '<div class="dropdown">';
$text .=                '<a href="/products">Products</a>';
$text .=                '<div class="menu-popup">';
$text .=                '</div>';
$text .=            '</div>';

$text .=            '<div class="dropdown">';
$text .=                '<a href="/about">About</a>';
$text .=                '<div class="menu-popup">';
$text .=                '</div>';
$text .=            '</div>';

Jquery：

<script>
    $(".dropdown").mouseover(function() {
       //Highlighting over the parent "dropdown" closes all other popup menus & 
       //displays the popup related to the parent
       $(".menu-popup").not(this).find(".menu-popup").hide();
       $(this).find(".menu-popup").fadeIn("fast");

       //Reset the timer to hide popup if scrolling back over parent
       //before time runs out
       if (hideTimer !== null) {
           clearTimeout(hideTimer);
       }
    });

    //Scrolling off of the dropdown parent will set a timer that will 
    //hide the menu-popup
    $(".dropdown").bind("mouseout", function(){
        hideTimer = setTimeout(function(){
        $(".menu-popup").fadeOut("fast");
     }, 300);

});
</script>

Answer 1

在这种情况下，$(this)是指drop-down而不是menu-popup。因此，您需要在menu-popup内找到drop-down，但不要在当前drop-down内找到。{/ p>

更改此

$(".menu-popup").not(this).find(".menu-popup").hide();

到

 $(".dropdown").not(this).find(".menu-popup").hide();

Answer 2

完全删除not()，之后你会褪色，所以只需隐藏它们。

$(".menu-popup").hide();
$(this).find(".menu-popup").fadeIn("fast");

Answer 3

我只是建议这样使用：

$(".menu-popup").hide();//first hide all menu-popup
$(this).find(".menu-popup").fadeIn("fast"); //display this menu-popup only

.not（）并不适合我

3 个答案: