Question

$("#slideDownDiv").mouseout(function () {
    $(this).animate({
        opacity:"0"
    });
    $(this).css({
        display: "none",
    })
});

我有一个名为slideDown的div，它在鼠标悬停时淡化了一个名为slideDownDiv的div。

slideDownDiv包含2个其他div，div a和div b。

div a和div b均包含ul。

现在我想淡出＆＃34; slideDownDiv＆＃34;在mouseout上。但是＆＃34; slideDownDiv＆＃34;当我的鼠标位于div中间的某个地方时，淡出了＃34;光标还没有从div中退出＆＃34;。

这里的任何人都可以告诉我为什么？

是因为slideDownDiv孩子吗？

我该如何解决？

Answer 1

您正在使用mouseout事件处理程序，它应该是mouseleave：

$('#slideDown').on('mouseover', function () {
    $('#slideDownDiv').stop( true, true ).fadeIn();
})

$('#slideDownDiv').on('mouseleave', function () {
    $(this).stop( true, true ).fadeOut();
});

Demo

Here是mouseout()和mouseleave()

之间的差异

使用jQuery淡化mouseout上的slideDownMenu

1 个答案: