遇到document.body.scrollTop值为0的问题

今天在写一个小demo的时候,使用滚动条,我用document.body.scrollTop获取滚动条的位置,但是很奇怪的发现在谷歌上获取到的是0,经过搜索后发现可以使用documentElement.scrollTop可以获取到,于是就去研究了一下

可以使用window.pageYoffset

所有主流浏览器都支持 pageXOffset 和 pageYOffset 属性。

注意: IE 8 及 更早 IE 版本不支持该属性

但可以使用 "document.documentElement.scrollLeft" 和 "document.documentElement.scrollTop" 属性 。

或者是下面这个

let Top = document.documentElement.scrollTop || document.body.scrollTop;

关于document.body.scrollTop与documentElement.scrollTop的更多相关文章

  1. JS基础篇-- body.scrollTop与documentElement.scrollTop

    获取当前页面滚动条纵坐标的位置:document.body.scrollTop与document.documentElement.scrollTop 获取当前页面滚动条横坐标的位置:document. ...

  2. 火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

    一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.on ...

  3. document.documentElement.scrollTop || document.body.scrollTop

    如果有doctype的声明,需要用document.documentElement.scrollTop没有doctype的声明,用document.body.scrollTop

  4. document.body.scrollTop or document.documentElement.scrollTop

      用Javascript获取DOM节点相对于页面的绝对坐标时,需要计算当前页面的滚动距离,而这个值的获取又取决于浏览器. 在Firefox或Chrome浏览器的控制台可以查看document.bod ...

  5. document.body.scrollTop vs document.documentElement.scrollTop

    window.addEventListener("scroll", function () { if (document.body.scrollTop >= window.i ...

  6. document.body.scrollTop vs document.documentElement.scrollTop && document.body.scrollHeight vs document.documentElement.scrollHeight

    FireFox下 document.body.scrollHeight || document.documentElement.scrollHeight;//等价 document.body.scro ...

  7. document.body.scrollTop与document.documentElement.scrollTop兼容

    这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声 ...

  8. js中的document.body.scrollTop与document.documentElement.scrollTop

    获取当前页面滚动条纵坐标的位置:document.body.scrollTop与document.documentElement.scrollTop获取当前页面滚动条横坐标的位置:document.b ...

  9. document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

    转自http://wo13145219.iteye.com/blog/2001598 一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取do ...

随机推荐

  1. 2017ecjtu-summer training #6 Gym 100952D

    D. Time to go back time limit per test 1 second memory limit per test 256 megabytes input standard i ...

  2. HDU--2015

    偶数求和 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total Submi ...

  3. spring如何控制事务

    Spring 的事务,可以说是 Spring AOP 的一种实现. AOP面向切面编程,即在不修改源代码的情况下,对原有功能进行扩展,通过代理类来对具体类进行操作. spring是一个容器,通过spr ...

  4. 通俗理解TCP握手次数是三次

    理解之后,应该说是至少三次就可以保证可靠传输了. 看到网上一篇帖子http://www.cnblogs.com/TechZi/archive/2011/10/18/2216751.html是这么说的, ...

  5. 了解前端中的SPA

    单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序. 单页W ...

  6. Java map 详解 - 用法、遍历、排序、常用API等

    尊重原创: http://www.cnblogs.com/lzq198754/p/5780165.html 概要: java.util 中的集合类包含 Java 中某些最常用的类.最常用的集合类是 L ...

  7. PHP中的GetType和SetType

    大部分的可变函数都是用来测试一个函数的类型的.PHP中有两个最常见的函数,分别是gettype()和settype().这两个函数具有如下所示的函数原型,通过他们可以获得要传递的参数和返回的结果. s ...

  8. 将本地的项目导入到github仓库总结lxw

    关键步骤: 第一:git clone https://github.com/lxw18231857001/demo-.git           #把github上面的仓库克隆到本地 本地项目文件夹下 ...

  9. laravel中数据库在哪个文件中配置

    我们使用 mysql 数据库,修改 .env: DB_HOST=localhost DB_DATABASE=laravel DB_USERNAME=root DB_PASSWORD= 在mysql中创 ...

  10. 用dedecms做网站时,空间服务器选择IIS还是apache???

    想做一个dedecms程序的网站,不知道要选择什么样的空间,windows还是linux的?多大的空间比较适合?求高人回答.   如果是基于Linux平台的话,那不必多说自然是Apache了,因为II ...