jquery - jQuery停止子元素在父元素悬停时动画

Question

我正在尝试为#jam 列表中的 div 设置动画。

li 有一个背景图像，当悬停时会显示框类。

我遇到的问题是，当我将框类 div 悬停时，它们也会触发悬停。

我怎样才能只让 li 背景图像悬停而不是其中的元素？

/*Services Pyrimid*/
$('ul#jam li').hover(function() {
    $(this).find('div:first').animate({opacity: 1.0, left:190}, 500);
},function(){
    $(this).find('div:first').animate({opacity: 0, left:-400}, 500);        
});


<ul id="jam">
 <li id="spot-a">
  <div class="box">
   text
  </div>
 </li>
 <li id="spot-b">
  <div class="box">
   text
  </div>
 </li>
</ul>

Answer 1

尝试添加：

$(".box").on('mouseenter mouseleave', function(e) {
    e.stopPropagation();
});

或做：

$('ul#jam li').not('.box').hover(function() {...