jQuery的动画导航栏，不能动画

Question

行，所以我是一个有点困惑，我想什么，但还是老样子着我的动画链接背景颜色，甚至是简单的警报，帮我解决了概率：

/* jQuery */ 

$(document).ready(function() { 

    $("#menu a").mouseover(function() { 
     $(this).animate({ "left": "-=50px" }, "slow"); 

    }); 


}); 

HTML：

<div id="menu"> 
<ul> 
<li><a href="http://www.xn----2hckboeejufb0a1k.com/">One</a></li> 
<li><a href="http://www.xn----2hckboeejufb0a1k.com/">Two</a></li> 
<li><a href="http://www.xn----2hckboeejufb0a1k.com/">Three</a></li> 
</ul> 
</div> 

谢谢！

Answer 1

你举的例子只是罚款...看到：http://jsfiddle.net/georeith/MhmAm/

的left性能不会有任何影响，除非a元素有一个非静态position属性。

如果没有插件，您也无法为属性background-colour设置动画。请参阅：https://github.com/jquery/jquery-color

否则，请确保您正确加载jQuery库并检查控制台是否有任何错误。

Answer 2

尝试添加不透明兄弟。

$（本）.animate（{ 不透明度：0.25， 左： ' - = 50'， 高度： '切换' }， '慢'）;

Answer 3

$("#menu a").mouseover(function() { 
     changeColor($(this),["olive","red","blue","white"]); 
    }); 
    function changeColor(component,colors){ 
     var firstColor = colors[0]; 
     for(var i in colors){ 
      component.animate({ backgroundColor: colors[i]}, 'slow' , function(){ 
       if(colors.length < (i + 1)){ 
        component.animate({ backgroundColor: colors[i + 1]},'slow',function(){ 
         component.animate({ backgroundColor: firstColor}, 'slow'); 
        }); 
       } 
      }); 
     } 
    }