2

現在、動的 div コンテンツを強化する次のスクリプトがあります。 

$("a.mbl").click(function() {

    var mblid = $(this).attr("id");

    $("#mid-box-left").fadeOut(250, function() {
        $("#mid-box-left").html($("#mbl" + mblid).html())
        .hide()
        .fadeIn(250, function () {
            $('#mid-box-left')

            $("#mid-box").on("mouseenter", "a.testbox", function() {

                var tbid = $(this).attr("id");

                $("#mid-box-right").fadeOut(250, function() {
                    $("#mbr" + tbid).css("display", "block")
                    .hide()
                    .fadeIn(250, function () {
                        $("#mbr" + tbid)
                    });
                });
            });

            $("#mid-box").on("mouseleave", "a.testbox", function() {

                var tbid = $(this).attr("id");

                $("#mbr" + tbid).fadeOut(250, function() {
                    $("#mbr" + tbid).css("display", "none");
                    $("#mid-box-right").fadeIn(250);
                });
            });
        });
    });
    return false;
})

この機能は、ユーザーがロゴ ブロックから一連のロゴを選択できるようにすることで機能します。これにより、ロゴの横に特定の div コンテンツが表示されます。次に、ユーザーがその div コンテンツにカーソルを合わせると、非表示の div がロゴ ブロックの上部にフェードインします。ユーザーが div を離れると、非表示の div がフェードアウトし、ロゴ ブロックが元に戻ります。

私が遭遇している問題は、ユーザーがマウスを a.testbox 領域から出し入れするのが速すぎると、2 つのアニメーションが衝突しているように見え、非表示の div コンテンツとロゴ ブロックの両方が同時に表示されることです。

ユーザーがマウスを関連する div から出入りさせた場合にトランジション アニメーションがトリガーされないようにする方法はありますか?

4

1 に答える 1

1

is(':animated')アニメーション化する要素をチェックして、現在アニメーション化されているかどうかを確認できます。チェックが返された場合は、アニメーションをトリガーする必要がありますfalse。

于 2012-09-29T19:13:36.143 に答える