2016-08-03 44 views
2

我想在滾動處於特定高度時運行或停止幻燈片顯示。如何通過window.scroll設置幻燈片切換

但它總是運行。

我該如何解決?

感謝

$(document).ready(function() { 
    var timer, _showSpeed = 3000, _stop = false; 
    setTimeout(autoPlay, _showSpeed); 

    function autoPlay(){ 
    if($('a[href="#index"]').parent().hasClass('active')){ 
     $('.center:eq(0) .arrow.right').click(); 
    }else if($('a[href="#favorable"]').parent().hasClass('active')){ 
     $('.center:eq(1) .arrow.right').click(); 
    } 

    setTimeout(autoPlay, _showSpeed); 
    return false; 
} 

$(window).scroll(function() { 
    scrollTop = $(window).scrollTop(); 
    if(scrollTop > 80){ 
     _stop = true; 
     timer = setTimeout(autoPlay, _showSpeed); 
     clearTimeout(timer); 
    } 
    else{ 
     _stop = false; 
     clearTimeout(timer); 
    } 
    console.log(_stop); 
}); 

}); 

回答

1

你可以嘗試用下面的代碼:

$(document).ready(function() { 
    var timer, _showSpeed = 3000, 
    _stop = false; 
    timer = setTimeout(autoPlay, _showSpeed); 

    function autoPlay() { 
    if(_stop) 
     return; 

    if ($('a[href="#index"]').parent().hasClass('active')) { 
     $('.center:eq(0) .arrow.right').click(); 
    } else if ($('a[href="#favorable"]').parent().hasClass('active')) { 
     $('.center:eq(1) .arrow.right').click(); 
    } 

    timer = setTimeout(autoPlay, _showSpeed); 
    return false; 
    } 

    $(window).scroll(function() { 
    scrollTop = $(window).scrollTop(); 
    if (scrollTop > 80) { 
     _stop = true; 
     clearTimeout(timer); 
    } else { 
     _stop = false; 
     timer = setTimeout(autoPlay, _showSpeed); 
    } 
    console.log(_stop); 
    }); 

});