jquery - 使用 jQuery 弹跳图像

Question

我正在尝试使一些图像“反弹”。

http://jsfiddle.net/d7UjD/43/

$('#bbb').mouseenter(function() {
    $(this).stop().effect('bounce',500);
});
$('#bbb').mouseleave(function() {
    $(this).stop(true,true);
});
$('#target').mouseenter(function() {
    $(this).stop().effect('bounce',500);
});
$('#target').mouseleave(function() {
    $(this).stop(true,true);
});
$('#sears').mouseenter(function() {
    $(this).stop().effect('bounce',500);
});
$('#sears').mouseleave(function() {
    $(this).stop(true,true);
});

<div id="RegStores">
    <a href="http://www.bedbathandbeyond.com/regGiftRegistry.asp?wrn=-1824276933&amp;" target="_new"><img src="http://www.dkg2012.com/img/bbb.png" id="bbb" width="144" height="48" border="0" /></a>
    <a href="http://www.target.com/RegistryGiftGiverCmd?isPreview=false&amp;status=completePageLink&amp;listId=HCoY5fRCrcOOxRCdNn3i6g&amp;registryType=WD&amp;isAjax=false" target="_new"><img src="http://www.dkg2012.com/img/target.png" id="target" width="143" height="34" border="0" style="padding-left: 10px; padding-bottom: 5px;" /></a>
    <a href="http://www.sears.com/shc/s/GRManageView?storeId=10153&amp;catalogId=12605&amp;langId=&amp;externalId=900040792636010101&amp;grUserType=BUYER&amp;fwdURL=GRGuestRegistryView&amp;sortType=category" target="_new"><img src="http://www.dkg2012.com/img/sears.png" width="142" height="40" border="0" id="sears" style="padding-left: 10px;" /></a>
</div>

#RegStores {
    position:absolute;
    bottom:10px;
    left:23px;
    width:467px;
    height:50px;
    z-index:30;
}

如何在不使其他图像向下移动的情况下让它工作。而且，当您在图像上快速移动鼠标时，它会导致图像不断向上移动 - 我该如何解决这个问题？

Answer 1

我在评论中的意思是动画正在执行此操作(即添加 display: block).. 实际上它并没有真正添加它本身，而是将元素包装起来以进行动画处理在一个分区中。您可以添加 .ui-effects-wrap { display: inline-block; 解决这个问题:

http://jsfiddle.net/d7UjD/46/

但是，这只适用于支持它的浏览器，因此您可能不得不使用 float 代替。您可能还应该使用更具体的规则(例如，将所有这些都包装在自己的 div 中)，这样您就不会影响使用该类的其他效果。理想情况下，jQuery 也有办法更改包装器类。我无法想象它不会..

编辑:在被 Good Guy Greg 批评没有回答多部分问题的所有部分之后，我在这里创建了一个更新:

http://jsfiddle.net/d7UjD/47/

这将防止图像在已经设置动画时在悬停时设置动画。就个人而言，这对我来说是最理想的，但如果你想在鼠标移开时停止动画(对我来说没有意义)或再次在鼠标悬停时停止，你将不得不做其他事情。