Javascript Jquery悬停在最低的元素层

例如，我得到了以下html：

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

我有一个更大的代码，但它太大，无法发布。我试过的每个函数都不是很好。我只想在最底层的元素div1上触发悬停。但大多数情况下，如果触发了

fadeIn（）

，光标在上面移动，div1上的悬停效果就会结束

---

是否有包含所有子元素的悬停函数？

如果我知道您希望在悬停父元素时淡入所有子元素

鉴于您的问题中添加了CSS标记，我将给出一个CSS回答：

---

使用Jquery的第n个子选择器如何。我无法在这里粘贴示例，因为我目前在外面。 但是如果你读了它，这应该是有效的。

---

使用

mouserover

将适用于所有子元素。好的，我试试。谢谢你的评论。

hover（）

不是

mouserover（）

和

mouseout

的组合吗？好的，谢谢你的快速回答。这个我不知道这个css解决方案，非常有趣。但这对我来说只是一个例子，真正的函数有div，它们被设置为左上方的动画，以便永久移动。如果我将其中一个悬停，它应该停止并显示子元素。正常的jquery hover函数可以工作，但每次调用子元素时，都会触发out函数，而不是子元素的in函数。这会带来难看的错误：/你也可以使用CSS转换/动画来管理移动吗？我认为不是这样。div移动到的坐标在一段时间内随机渲染。但我没有尝试在css中这样做。我会在几分钟后给你反馈。谢谢你，但是动画停止功能会抛出错误。我想现在我已经尝试了所有我知道的解决方案

moseenter/mouseleave

/

悬停

/

mouseover/mouseout

/

css

。还有其他想法吗/

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

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