0

タブをホバーすると少し動くこのタブスライダーがあります。スライダーがスライドされていない場合にのみ、これが発生することを望みます。それが出ているとき、それはホバーで動くべきではありません。 ここで実際の例を参照してください。

スライダーは、スライドするとクラスが「開く」ようになるため、次のコードを追加してみました。

if (!$("#contactContainer").hasClass("open")) {
    $("#contactContainer").hover(function() {
        $(this).stop(true, true).animate({
        "right": "+=30px"
    }, 300); }, function() {
        $(this).stop(true, true).animate({
        "right": "-=30px"
    }, 300); });
}

ただし、違いはないようです。開いているスライダーは、ホバリングしても動きます。これを修正するにはどうすればよいですか?

4

4 に答える 4

2

SpaceDog の例を使用すると、スライダーは閉じますが、画面外でアニメーションを続けます。これは、「open」クラスがすぐに削除され、マウスがコンテナー上にあるときにホバー動作がトリガーされるためです (タブを画面の左側から 45 ピクセル移動し、ユーザーが再度クリックできないようにします)。

「:animated」プロパティも確認すると、ホバー動作がトリガーされないようにすることができるため、タブを画面に表示したままにできます。

$("#contactContainer").hover(
    function() {
    if (!$(this).hasClass("open") && !$(this).is(":animated")) {
        $(this).stop(true, true).animate({"right": "+=45px"}, 300);
    }
    }, function() {
        if (!$(this).hasClass("open") && !$(this).is(":animated")) {
            $(this).stop(true, true).animate({"right": "-=45px"}, 300);
        }
    }
);
于 2013-10-09T08:50:01.677 に答える
0

その if ステートメントをホバー関数に移動し、クラスが開いていない場合にのみアニメーション化する必要があります。

あなたの if チェックは現在、ページがロードされたときにのみコンテナをチェックしています。

于 2013-10-09T08:34:29.687 に答える