JQueryUI弹跳效果：div在动画发生时消失

Question

我已经对列表中的某些图像实施了JQuery弹跳效果。该列表设置是水平的下面的CSS：

#sociallinks li{ 
    list-style:none; 
    display: inline; 
} 

的反弹效果可与mouseover()。但是，当我将鼠标悬停在列表中的图像上时，列表会回到正常垂直状态（即，<li>'s松开它们的位置）。一旦反弹动画结束，图像恢复其正常位置。

有没有人知道如何保留元素的位置，而动画occruing？

谢谢！

我全码：

#sociallinks li{ 
    list-style:none; 
    display: inline; 
    padding: 5px; 
    width: 40px; 
} 

<script> 
$(function(){ 
    $('.socialicon').mouseover(function() { 
      $(this).effect("bounce", { times:5 }, 300); 
    }); 

}); 
</script> 

<ul> 
<li class="socialicon"><img src="assets/images/facebookicon.png"></li> 
<li class="socialicon"><img src="assets/images/twittericon.png"></li> 
<li class="socialicon"><img src="assets/images/pinteresticon.png"></li> 
</ul> 

Answer 1

似乎与使用<li> S和反弹的问题。将它们更改为div，并且左边浮动，似乎没问题