gpt4 book ai didi

jquery - 为什么我的 mouseout fadeOut 有效,但随后又淡入?

转载 作者:太空宇宙 更新时间:2023-11-03 20:54:41 24 4
gpt4 key购买 nike

我有一个 div,其中有一个嵌套元素,当悬停在 div 上时会显示该元素。这行得通。

在 mouseout 上,嵌套元素应该隐藏,它确实隐藏了,但随后又立即淡入,就好像我刚刚将鼠标悬停在初始 div 上一样。

我做了 a jsfiddle replicating the issue over here .

html 是:

<div class="add_bag_large_wrap">

<div class="add_bag_large_droid" style="margin: 90px auto;">
I am a button.
<div class="add_includes">
<p>Show on hover, hide on mouseout</p>

</div>
</div>

JS:

 $('.add_bag_large_droid').live('hover',function(){

$(this).children('.add_includes').fadeIn();

}).mouseout(function(){

$('.add_includes').fadeOut();

});

CSS:

.add_bag_large_wrap {
position: relative;
width: 390px;
height: 96px;
margin: 36px auto;
}

.add_bag_large_droid {
background: #ccc;
width: 390px;
height: 96px;
cursor: pointer;
background-size: 390px 192px;
position: static;
}

.add_includes {
background: #000; padding: 18px; color: #fff; position: absolute;
bottom: 110px; left: 50%; margin-left: -148px;
display: none;
text-align: left;
}

.add_includes p {
font-size: 11px; color: #fff; margin: 0;
}

是什么导致了这种行为?

最佳答案

也更改您的 JS 代码:

 $('.add_bag_large_droid').hover(function(){
$(this).find('.add_includes').fadeIn();
}, function(){
$(this).find('.add_includes').fadeOut();
});

使用 live():

$('.add_bag_large_droid').live({
mouseover: function() {
$(this).find('.add_includes').fadeIn();
},
mouseout: function() {
$(this).find('.add_includes').fadeOut();
}
});

关于jquery - 为什么我的 mouseout fadeOut 有效,但随后又淡入?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12006817/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com