在$（window）上执行scrollTop动画。使用jquery的滚动

Question

我试图每次在页面上滚动页面时移动一次幻灯片。但滚动事件不会停止并重复该事件。我怎样才能让动画每次只用一次$(window).scroll中的scrollTop移动到下一张幻灯片颜色？见我Fiddle

这是一段代码，它不工作:(

$('html, body').animate({ 
    scrollTop: ($(next).offset().top) 
},500); 

我的目标是类似的东西http://www.sincedilla.com/

Answer 1

这可能是你所需要的。 scroll事件被阻止直到动画结束， 动画文档阅读回调章节

$(this).bind('mousewheel', function (e) { 
    if (!animating) { 
     animating = true; 
     if (e.originalEvent.wheelDelta < 0) { 
      next = $(first).next(); 
      first = $(next); 
      // scroll down 
      $("html, body").animate({ 
       scrollTop: ($(next).offset().top) 
      }, 900, function(){ 
       animating = false; 
      }); 
     } else { 
      first = $(next).prev(); 
      next = $(first); 
      // scroll up 
      $("html, body").animate({ 
       scrollTop: ($(first).offset().top) 
      }, 900,function(){ 
       animating = false; 
      }); 
     } 
    } 
    return false; 
}); 

工作小提琴http://jsfiddle.net/fdbh0no8/