Javascript swing div的动画正受到其他div的影响

我正在尝试在hover上实现一个摆动效果，它工作得很好，但是当我向其他元素添加不同的效果时，它的效果会受到影响

<!-- THIS CODE BRAKES SWING-->
<div id="abc"> <a href="#" title="Social Cause" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Litter','','Images/abc2.png',1)"><img src="Images/abc1.jpg" width="203" height="311" id="Litter"></a>
</div>

js

---

这里有一把小提琴，它正正确地摆动着

代码太多，请制作一个JSFIDLE。PS：没有必要包括你的谷歌分析脚本。建议编辑您的问题。@Tibbers我添加了一把小提琴，。。你现在能帮我吗！您的小提琴似乎与您的问题不匹配。@APAD1小提琴显示了它应该如何摆动！我应该放一把小提琴，告诉它在添加另一个元素后是如何摆动的吗？小提琴显示了一个使用CSS动画的摆动元素，你的问题暗示了使用Javascript的动画。而且，你的小提琴并没有复制你所描述的问题。

  #litter {
    position: absolute;
    left: 483px;
top: 0px;
    width: 203px;
    height: 380px;
    z-index: 1;
}

function MM_swapImgRestore() { //v3.0
    var i, x, a = document.MM_sr;
    for (i = 0; a && i < a.length && (x = a[i]) && x.oSrc; i++) x.src = x.oSrc;
}

function MM_swapImage() { //v3.0
    var i, j = 0,
        x, a = MM_swapImage.arguments;
    document.MM_sr = new Array;
    for (i = 0; i < (a.length - 2); i += 3)
    if ((x = MM_findObj(a[i])) != null) {
        document.MM_sr[j++] = x;
        if (!x.oSrc) x.oSrc = x.src;
        x.src = a[i + 2];
    }
}