hover（）backgroundColor problem

Question

 
$('li > a').hover(
    function(){ 
    $(this).animate({ 
    backgroundColor: '#2a639a', 
    color: '#fff' 
    },300).corner('5px'); 
    }, 
    function(){ 
    $(this).animate({ 
    background: 'transparent', 
    color: '#444' 
    },300); 
    } 
); 

背景有什么问题：'transparent'？ 变回白色，不透明

Answer 1

重要的是要注意的：透明的CSS为0％不透明度不同。

不透明度可以毕业，而tranparent可以打开或关闭。因此，您无法对纯色进行透明动画处理，并期待平滑过渡。如果您尝试，大多数浏览器会将其视为黑色或白色以用于动画，我认为这是您在此处看到的。

改变透明度的动画可能会给你一个更平滑的过渡，当然它不同（对于初学者来说，它会影响整个元素，不仅仅是背景，还有需要考虑的浏览器兼容性问题）。

Answer 2

您不能为背景属性设置动画。

也许你可以使用精灵，使用BackgroundPosition Plugin

Answer 3

只能用jQuery来动画背景颜色是不可能的。 jQuery仅支持数字值in the jQuery-API您可以使用jQuery UI为背景颜色设置动画效果。