Question

如何使用javascript滚动页面，直到滚动高度为预定义像素数？

function pageScroll() {
    // Next line is pseudocode:
    if (window.ScrolledHeight != SOME_NUM)
       window.scrollBy(0,50);
}
scrolldelay = setTimeout('pageScroll()',100);

应该对某些事情进行一些逻辑检查。你能帮助我，如何获得滚动高度？

Answer 1

你能否在函数之外使用一个变量，每次运行pageScroll时它会将值增加50个像素，然后检查它是否等于或大于你要查找的值？

e.g。

var scrollAmount = 0;

function pageScroll() {
    window.scrollBy(0,50);
    scrollAmount += 50;
    if(scrollAmount < 200) {
        scrolldelay = setTimeout('pageScroll()',100);
    }
}

如果您不想使用全局变量，也可以使该函数接受您修改的参数。

Answer 2

首先，您不应该使用setTimeout您应该使用setInterval。基本上因为它更好地实现了你的目的，而且就实际时间而言更准确。谷歌，如果你想了解更多关于该主题的信息。但你需要的是clearInterval方法。此外，在setTimeout和setInterval内部使用匿名函数会更快。

startPageScroll(){
  var scrollAmt = 0;
  var id=setInterval(function(){
    if(scrollAmt</*Whatever your limit is*/){
      window.scrollBy(0,50);
      scollAmt+=50;
    }
    else{clearInterval(id);}
  },100);
}

有一些方法可以获得页面的实际滚动，但你必须做这样的事情，这是更多的代码，然后只是保持你已经移动了多远的总计。

var scroll;

if(window.pageYOffset){
  scroll=window.pageYOffset;
}
else{
  scroll=document.body.scrollTop;
}

这是一个可能对http://codepunk.hardwar.org.uk/ajs02.htm有帮助的链接。

Answer 3

你已经有了有效的答案，但我会添加一些味道，它会滚动但在达到目标滚动点之前会减慢：

function pageScroll() {
    var delta = min(SOME_NUM-window.ScrolledHeight)>>1,50);
    if (delta > 0) {
       window.scrollBy(0,delta);
       setTimeout('pageScroll()',100);
    }
}

一个不错的副作用是它应该准确到达SOME_NUM，无论它是否为50（您的滚动量）的倍数。

滚动页面直到某个高度

3 个答案: