0

abortTimer関数が起動されるまで、ホバーされていない状態とホバーされた状態の間のいくつかのリンクを無期限にアニメーション化する関数をJQueryで作成しようとしています。a.mus-plr反対の時間の間と反対の時間にアニメーション化したいa.earbudsので、要素の1つで'.hover'クラスが有効になっている場合、もう1つではクラスが有効になりません'.hover'。各要素を3000ミリ秒ごとにホバー状態を切り替えたいと思います。

どんな助けでも大歓迎です！これを機能させることができないようです。setIntervalタイマーの定義方法に問題があるのではないかと思います。ありがとう！！

JQueryファイル：

$(document).ready(function(){
    var tid = setInterval(animateControls, 4000);
    function animateControls() {
        $("a.mus-plr").delay(2000).addClass('hover').delay(2000).removeClass('hover');
        $("a.earbuds").addClass('hover').delay(2000).removeClass('hover');
    }
    function abortTimer() {
        clearInterval(tid);
    }
});
4

1 に答える 1

1

インターバルタイマーが期限切れになるたびにクラスを切り替えるだけで、一方がホバークラスを持ち、もう一方がホバークラスを持たないことから始まります。hover

要素がホバーされたときに自動トグルを停止するように編集されました。

$(function() {
     var doToggle = true;

     $('a.mus-plr').removeClass('hover');
     $('a.earbuds').addClass('hover');

     var tid = setInterval( function() {
          if (doToggle) $('a.mus-plr, a.earbuds').toggleClass('hover');
     }, 2000);

     setTimeout(function() {
        if (tid) clearInterval(tid);
        $('a.mus-plr,a.earbuds').removeClass('hover');
     }, 30000); // stop toggling after 30 seconds

     $('a.mus-plr,a.earbuds').hover( function() {
           doToggle = false;
     }, function() {
           doToggle = true;
     });
});
于 2012-06-09T20:16:12.897 に答える