Question

在设置了以下CSS时，我无法scrollTop处理body：

html, body { height: 100%; }
html { overflow: hidden; }
body { overflow: auto; }

我想要实现的是页面始终滚动到150px的网格。因此，例如，如果用户向下滚动161px，在完成滚动后，页面将自动滚动回150px。

到目前为止，这是我的代码：

//timer
var timer = null;

//body scroll
$('body').scroll(function(){

  //clear timer
  if (timer !== null) clearTimeout(timer);

  //set timer
  timer = setTimeout(function() {

    //scroll calculations
    var sectionOffset = $('body').scrollTop(),
        scrollAmount = Math.round(sectionOffset/150) * 150,
        scrollPx = scrollAmount + 'px';

    //lock to grid
    $('body').animate({scrollTop:scrollPx},200,'linear');
  },300);

});

表明它不起作用的小提琴：http://jsfiddle.net/swjabxqq/1/

我已经在其他CSS情况下对代码进行了测试，但确实有效。当CSS设置如上时，如何使用JS / jQuery滚动主体？

Answer 1

删除此CSS：

html { overflow: hidden; }
body { overflow: auto; }

并改变

$('body').scroll(function(){

要：

$(window).scroll(function(){

用户完成滚动体后动画scrollTop

1 个答案:

Demo Fiddle