1

重複の可能性:
移動が遅すぎる場合のjqueryのmouseleaveの問題

mouseover()との間に遅延があるようmouseleave()です。私のコードを見ると、200ms/1msの遷移があります。2つのアニメーションの間にラグがある理由がわかりません。

最新バージョンFF(14.0.1)でi7コアを使用しています...

開発サイトへのリンク:http: //blox.comze.com/ (CSSは現在IE9 / chrome / FFでのみ安定しています)

考え?

<div id="header">
    <div id="headerInner">
        <div id="power" class="menuitem">
            <img style="height:30px;" src="http://{url root=$context.root}static/img/leaf4.png" />
            <a class="menutext">&nbsp;POWER</a>
        </div>
        <div id="services" class="menuitem">
            <img style="height:30px;" src="http://{url root=$context.root}static/img/wrenchscrew.png" />
            <a class="menutext">&nbsp;SERVICES</a>
        </div>
        <div id="cashback" class="menuitem">
            <img style="height:30px;" src="http://{url root=$context.root}static/img/dollarsign.png" />
            <a class="menutext">&nbsp;CASHBACK</a>
        </div>
        <div id="schedule" class="menuitem">
            <img style="height:30px;" src="http://{url root=$context.root}static/img/calender.png" />
            <a class="menutext">&nbsp;SCHEDULE</a>
        </div>
    </div>    

</div>

<script>
$("#power,#services,#cashback,#schedule").mouseover(function() {
    $(this).animate({ backgroundColor: "#333"}, 200 );
}).mouseleave(function() { 
    $(this).animate({ backgroundColor: "#000"}, 1);
});
</script>
4

1 に答える 1

1

まず最初に、すべてがスムーズに実行されるようにするため、ドキュメントの準備ができている必要があります。次のことを試してください。

$(document).ready(function() {
    $("#power,#services,#cashback,#schedule").hover(function() {
        $(this).animate({ backgroundColor: "#333"}, 200 );
    }, function() {
        $(this).animate({ backgroundColor: "#000"}, 1);
    });
});

また、マウスアウト時間は本当に速いので、それが問題になる可能性があります。

于 2012-08-11T02:45:36.043 に答える