Jquery 将项目悬停在“a”上标签

Question

我有一个链接元素，当你将鼠标悬停在它上面时，会出现一个 div 。该 div 应该位于链接元素之上。当我移动鼠标时，显示的 div 会闪烁。有没有办法解决这个问题。我假设这是因为 div 现在覆盖了链接元素。

谢谢， C

Answer 1

我猜你正在使用这样的代码：

$("a").hover(function () { // Enter
    $("div").show();
}, function () { // Leave
    $("div").hide();
});

在这种情况下，你的猜测是正确的。如果 div 悬浮在 a 上，当 div 显示时会触发鼠标离开，因为鼠标开始在 a 上。 code>div 而不是在 a 上。然后，div 被隐藏，鼠标再次输入a...一切又重新开始。

如果您可以避免 div 出现在上面（例如使用 z-index），那就更简单了。

否则，我建议您执行以下操作：

$("a").mouseenter(function () {
    $("div").show();
});

$("div").mouseleave(function () {
    $("div").hide();
});

如果您的鼠标在打开时始终位于 div 上，那么如果鼠标离开，它可以自行关闭。

Answer 2

听起来您没有测试 div 是否已经可见。您可以使用以下代码测试可见性：

if ($("div").is(":hidden")) {
    // make div visible here
}

希望这会有所帮助。

Answer 3

谢谢。这是我现在使用的代码...

$('area,#map-zoom').hover(function(){
$('#map-zoom').show();
}，功能（） {
$('#map-zoom').hide();
});

我也将悬停功能添加到出现的 div 中。