在IE、FF、Chrome下滚动条的onscroll事件

最新推荐文章于 2025-05-29 20:14:28 发布

ViVAJoy2008

最新推荐文章于 2025-05-29 20:14:28 发布

阅读量478

点赞数

分类专栏： JavaScript 文章标签： IE Chrome JavaScript CSS ViewUI

JavaScript 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现页面滚动同步的方法，该方法确保了在不同浏览器（包括IE、Firefox和Chrome）中的一致表现。通过调整特定的代码来解决各浏览器间scrollTop属性的兼容性问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[size=medium]有时在页面上，需要Fixed（css里的position属性）的效果，用JS实现的话，在如题的三个平台可以这样写：[/size]


window.onscroll = _onScroll;
function _onScroll(){

    var labeller_layer = document.getElementById('labeller_layer');
    var scrollTop = document.documentElement.scrollTop + document.body.scrollTop;

    labeller_layer.style.top = scrollTop  + 'px';

};

[size=medium]其中[color=red]document.documentElement.scrollTop + document.body.scrollTop;[/color]就是处理兼容性的关键，当页面加入DTD标示后 document.documentElement.scrollTop的值在IE和FF下正常，但document.body.scrollTop一直为0。在Chrome下就反过来了。[/size]

labeller_layer是一个我想随着滚轮移动的层

以上是针对onscroll事件平台兼容性的一个总结