jquery - jQueryはナビゲーションバーをアニメーション化し、アニメーション化できません

Question

OK、少し混乱しています。リンクの背景色をアニメーション化することはできませんが、単純なアラートでさえ、問題を解決するのに役立ちます。

/* 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

background-colourプラグインなしでプロパティをアニメーション化することもできません。参照：https ：//github.com/jquery/jquery-color

それ以外の場合は、jQueryライブラリを正しくロードしていることを確認し、コンソールにエラーがないか確認してください。

Answer 2

不透明度の仲間を追加してみてください。

$（this）.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');
                    });
                }
            });
        }
    }