javascript - 最低元素层的jquery悬停

Question

例如我得到了这个 html:

<div id="div1">
    <div id="div2"></div>
</div>

div2 是显示:无。

那么有没有jquery方法，在div1上触发悬停功能，显示div2。

像这样:

$('#div1').hover(function(){
    $('#div2').stop().fadeIn();
}, function(){
    $('#div2').stop().fadeOut();
});

我有一个更大的代码，但它太大而无法发布。我尝试的每个功能都不太好用。我只想在最低层元素 div1 上触发悬停。但大多数情况下，如果 fadeIn() 被触发并且光标移到它上面，div1 上的悬停效果就会结束。

是否有包含所有子元素的悬停功能？

Answer 1

如果我知道你想在父项悬停时淡入所有子项？

鉴于您在问题中标记了 CSS，我将给出一个 CSS 答案:

Demo Fiddle

#div1 *{
   opacity:0;
   transition:opacity 200ms ease-in;
}
#div1:hover *{
   opacity:1;
}