jQuery悬停在div上排除图像

我在div上放置了一个悬停动画，如下所示：

$('#divID').hover(function(){
$('#divID').animate({'margin-top': '-200px'}, 200);
});

这一切都很好， 但是当我把一个图像放在这个div中，我将鼠标悬停在这个图像上，而不是div的自由空间上，这个函数不会触发，因为这个图像是另一个对象

我希望不管div的内容如何，都能触发该函数

提前感谢。

编辑

正确：行为是正确的，因为你实际上要离开部门。不要将事件应用到孩子身上，并且：

---

基本上这不应该发生。您可以尝试使用直接的

mouseenter

事件而不是

hover

，但hover无论如何都会使用mouseenter。 对我来说，似乎还有另一个问题

试着这样做：

$('#divID').mouseenter(function(){
    $('#divID').stop().animate({'margin-top': '-200px'}, 200);
});

---

除了悬停事件，还应该使用mouseout事件。现在，您的脚本将是：

 $('#mostread').hover(function(){
$('#mostread').animate({'margin-top': '-200px'}, 200);

});

 $('#mostread').mouseout(function(){
$('#mostread').animate({'margin-top': '+200px'}, 200);
});

---

您能生成一个JSFIDLE示例吗？这对我来说很好。这是JSFIDLE：它可以工作，但是当你在图片上悬停时，这种行为真的很奇怪。请看我编辑的答案。非常感谢Alex！工作完美：）正如你已经写的；悬停同时实现mouseenter和mouseout，所以不应该有任何区别。这毫无意义$（）悬停（功能1，功能2）；只使用鼠标。因此，要么将.hover（）与2个函数一起使用，要么相应地使用mouseenter和mouseleave。而且，这不是作者的问题。。

 $('#mostread').hover(function(){
$('#mostread').animate({'margin-top': '-200px'}, 200);

});

 $('#mostread').mouseout(function(){
$('#mostread').animate({'margin-top': '+200px'}, 200);
});