0

我已经对列表中的一些图像实现了 JQuery 反弹效果。该列表设置为水平的,具有以下 css:

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

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

有谁知道在动画发生时如何保持元素的位置?

谢谢!

我的完整代码:

 #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>
4

1 回答 1

0

似乎是使用<li>s 和反弹的问题。将它们更改为左浮动的 div,似乎没问题

于 2012-08-07T00:13:19.300 回答