jquery - 当 div 出现在视口中时滚动到顶部

Question

很难找到这种技术的在线资源。

在我的JSFiddle中，用户可以使用“下一个”或“上一个”来循环浏览全屏 div。用户还可以滚动到下一个或上一个 div。

我的问题是，如果用户滚动，那么他们很难将全屏 div 与视口对齐，所以我希望当用户在屏幕上拥有大部分 div 时，它会自动滚动以将 div 的顶部与视口。

在我的 JSFiddle 中，我包含了一个脚本，它检测一个元素是否在视口中，它可以工作，但我不知道如何添加一个if语句，当 div 进入视口时，将 div 对齐到屏幕顶部使用.scrollTo.

Answer 1

你可以使用jQuery inview

然后像这样运行scrollTo：

$(elm).bind('inview', function(event, visible) {
  if (visible) {
    scrollTo();
  } else {
  }
});

可能还想在调整窗口大小时运行它：

var timerDelay = (function(){
  var timer = 0;
  return function(callback, ms){
    clearTimeout (timer);
    timer = setTimeout(callback, ms);
  };
})();



$(window).resize(function() {
   timerDelay(function(){

   //run inview function

   }, 500);
 });