function scrollPage() 在移動設備上不起作用

Question

我在 javascript 中有一個 function 需要上下滾動頁面，直到用戶按下按鈕將其禁用。 這是我當前的 function：

var scrollDirection = 1;
function scrollPage() {
  if (isScrollMode) {
    window.scrollBy(0, scrollDirection); // horizontal and vertical scroll increments
    scrolldelay = setTimeout('scrollPage()', 50); // scrolls every 50 milliseconds
    if (window.pageYOffset == 0) {
      scrollDirection = 1;
    } else if (window.pageYOffset == document.body.scrollHeight - window.innerHeight) {
      scrollDirection = -1;
    }
  }
}

到目前為止，此方法適用於計算機，但是，當我在手機上的 google chrome web 瀏覽器上測試此 function 時，它只會下降而不會上升。 一旦到達頁面末尾，它就會停留在那里。 誰能告訴我為什么？ 感謝您的幫助！

Answer 1

這是因為window.pageYOffset返回一個浮點數，在我的例子中78.4000015258789和document.body.scrollHeight - window.innerHeight返回一個 integer，在我的例子中是79 。 然后， (78.4000015258789 == 79) = false

您可以更改的是將 1 添加到window.pageYOffset以獲得79.4並檢查window.pageYOffset > (document.body.scrollHeight - window.innerHeight)

這是編輯后的代碼（必須有效）：

 var scrollspeed = 10; var scrollDirection = scrollspeed; function scrollPage() { if (isScrollMode) { window.scrollBy(0, scrollDirection); // horizontal and vertical scroll increments scrolldelay = setTimeout("scrollPage()", 50); // scrolls every 50 milliseconds if (window.pageYOffset == 0) { scrollDirection = scrollspeed; } else if ( window.pageYOffset + 1 > document.body.scrollHeight - window.innerHeight ) { //window.pageYOffset return a float scroll y value, for exemple in my case 78.4000015258789; //We add +1 to obtain 79.4 //(document.body.scrollHeight - window.innerHeight) return a interger of 79 scrollDirection = -scrollspeed; } } } let isScrollMode = true; scrollPage();

 <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p> <p>Lorem</p>