1

作業中の Web サイトに回転スライダーがあります。

スライダーは、ページが読み込まれると自動的にスクロールし、マウスが上に置かれると停止し、マウスが離れると再び開始するはずです。

スライダーの停止は機能していますが、マウスを離すとスライダーが再び起動しますが、2 倍の速さでスライダーにコンテンツが表示されません。

クリア間隔が正しく機能しない理由はありますか? 速度を変更したり混乱させたりすることなく、スライダーを停止および開始するにはどうすればよいですか?

     rotateSwitch: function() {  
       var myTimer=setInterval(function() { this.autoRotate(); }.bind(this), 5000);
       $('.hero img').hover(
         function() {
         window.clearInterval(myTimer)},
         function() {
         this.rotateSwitch();}.bind(this));
    },
4

1 に答える 1

0

マウスを離すたびに、 を呼び出して関数を再度バインドしますthis.rotateSwitch()。代わりに、間隔をもう一度開始するだけです。

rotateSwitch: function() {  
    var myTimer,
        that = this;
    function start() {
        myTimer = setInterval(that.autoRotate.bind(that), 5000);
    }
    function stop() {
        clearInterval(myTimer);
    }
    $('.hero img').hover(stop, start);
    start();
},

その関数が複数回呼び出される場合は、.hero imgセレクターを特定のコンテキストに制限することもできます。

于 2013-01-08T14:43:31.060 に答える