如何通过window.scroll设置幻灯片显示切换

时间:2016-08-03 08:24:58

标签: jquery

当滚动位于特定高度时,我想运行或停止幻灯片放映。

但它一直在运行。

我该如何解决?

谢谢

 $(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 个答案:

答案 0 :(得分: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);
  });

});