Question

将鼠标悬停在绿色框上，然后将鼠标移至子列表。突然开始像疯了一样眨眼，无论如何要阻止这个但是仍然将鼠标悬停在孩子身上？

* 之后编辑

Answer 1

这是您的工作代码http://jsfiddle.net/GNQyt/18 我使用了延迟方法。离开.icn后到达ul，您有1000毫秒。如果您在所需时间内点击ul，则会删除淡出请求。

$('.icn').on({
    mouseenter: function() {

        clearTimeout($(this).data('timeoutId'));

        $(this).children('ul').show('fast');
    },
    mouseleave: function() {

        var self = this;

        var timeoutId = setTimeout(function() {
            $(self).children('ul').hide('fast');
        }, 1000);

        $(self).data('timeoutId', timeoutId); 
    }
});

Answer 2

http://jsfiddle.net/GNQyt/5/

使用mouseenter，而不是在那种情况下悬停

这是“Mouseenter”与“Mouseover”http://api.jquery.com/mouseover/

之间的一个很好的互动比较

演示非常明确。

Answer 3

闪烁是由于从绿色框移动到弹出窗口而产生的。由于你已经离开绿色框，所以to之间的距离会导致计算机关闭弹出窗口，但是在弹出窗口完全关闭之前，鼠标到达弹出窗口，导致它再次打开。理想情况下，两者应相交以允许鼠标直接从盒子移动到弹出窗口。或者，在关闭弹出窗口之前增加延迟。

Answer 4

闪烁不是因为徘徊在孩子身上，而是在关闭时抓住菜单。将top: 0px; left: 0px;左上方的菜单移动即可解决问题。此外，height: 500px; width: 500px;改变跨度的高度和宽度也可以解决。为了使高度和宽度有效，将跨度改为div。

Answer 5

http://jsfiddle.net/GNQyt/17/

这是另一个使用hitbox的解决方案。这个是非常黑的，但我认为你会从中得到一个感觉：）

请记住

<span>
    <div>
    </div>
</span>

是一种非法操作，因为你不应该将块元素包装成内联元素。

jQuery在孩子身上徘徊怪异

5 个答案: