0

タグ内の各文字の色を変更し、リンクにカーソルを合わせるとポップアップが表示されるコードを作成しました。

mouseenter関数は正常に機能しますが、リンクにカーソルを合わせると、元の変更の逆を実行したいと思います（元の色に戻します）。

私はそれが機能するleave関数から遅延を取り除きますが、効果はそれほど良くありません。なぜこれが入口では機能するが、休暇では機能しないのかについて私は混乱していますか？

もう1つ言及すべきことは、色が灰色に戻ったときに、mouseenter関数が再び機能しないことです。これはちょっと面倒です。

これが私が話していることを見ることができるサイトへのリンクであり、リンクは「タッチマーケティング」と書かれている下部のリンクです

http://dev.touch-akl.com/colin/

何か助けてください？

私のjQueryは次のようになります

$('#copyright a').mouseenter(function(){

    var $letters = $(this).find('span'),
    $sayhi = $(this).find('img'),
    delay = 0;

    $sayhi.animate({top:-30, 'opacity':1}, 500, "easeInOutExpo");

    $letters.each(function(){

        $(this).delay(delay).queue(function(){
            $(this).css({'color':'#333'});
        });

        delay+=35;      

    }); // end each

}).mouseleave(function(){

    var $letters = $(this).find('span'),
    delay = 0;

    $letters.each(function(){

        $(this).delay(delay).queue(function(){
            $(this).css({'color':'#333'});
        }); 

        delay+=35;      

    });

}); // end leave
4

2 に答える 2

1

jQuery.queue()は正しく使用するのが複雑なので、jQueryアニメーションキュー内の他のものと対話する必要がない限り、このように使用する方がはるかに簡単setTimeout()です。またdelay、暗黙のグローバル変数にならないようにローカル変数を作成する必要があります。

}).mouseleave(function(){
    var delay = 0;
    $(this).find('span').each(function(){
        var item = $(this);

        setTimeout(function(){
            item.css({'color':'#333'});
        }, delay); 

        delay+=35;      
    });
}); // end leave
于 2013-03-06T00:36:01.687 に答える
-2

ほとんどの場合、問題は、mouseenterおよびmouseleaveの関数によって作成されたクロージャにあります。それらは両方とも同じ遅延変数を参照しています。あなたはそれらを分離したいかもしれません：

delayEnter = 0;
delayLeave = 0;
于 2013-03-06T00:36:12.140 に答える