Question

当用户滚动一定距离时，我想要更改一些文本。但是，当我滚动时，document.body.scrollTop的值仍为0。

var scroll = document.body.scrollTop;
if (scroll < 50) {
    document.write("A");
} else {
    document.write("B");
}

检查日志时，scroll的值永远不会从0开始，因此滚动时文本永远不会从A切换到B。感谢您提前提供任何帮助。

编辑：前三个答案中的任何一个似乎都不适合我。我想我应该提供一些背景信息。

构建我的设计组合网站。 View the early build here。当用户向下滚动页面时，我希望能够将横幅中的“设计者”一词更改为其他描述词，但似乎无法收听当前滚动位置。

Answer 1

这应该这样做。 “document.documentElement.scrollTop”是IE变体。应该跨浏览器工作。

window.onscroll = function() {
  var scroll = window.scrollY || document.documentElement.scrollTop;
  if (scroll < 50) {
    document.write("A");
  } else {
    document.write("B");
  }    
}

Answer 2

DEMO FIDDLE

var el = $('.test');

//alert(el.scrollTop());

el.on('scroll', function(){
    if(el.scrollTop()>50){
  alert(el.scrollTop());
    }

});

试试这个。

Answer 3

为什么要将该脚本内嵌在横幅内？为什么不在现有的$(window).scroll(function () {中实现您的逻辑，因为该事件似乎正在滚动时正确设置不透明度。

只需添加：

if(scrollTop < 50){ 
   $('#banner h1').text("My name is John. I'm a designer"); 
} else { 
   $('#banner h1').text("My name is John. I'm a thinker"); 
}

的 Live Demo

if(document.attachEvent){ document.attachEvent('onscroll', scrollEvent); }else if(document.addEventListener){ document.addEventListener('scroll', scrollEvent, false); } function scrollEvent(e){ var scroll = document.body.scrollTop; var text = null; if (scroll < 50) { text = document.createTextNode('A'); } else { text = document.createTextNode('B'); } document.body.appendChild(text); }

虽然与您的问题无关，但您应尽可能远离document.write。有关详细信息，请参阅Why is document.write considered a "bad practice"?。

document.body.scrollTop值停留在0

3 个答案: