遇到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. [hdu5632][BC#73 1002]Rikka with Array

    点开BC发现今晚没比赛..然后似乎上一场有数位DP?...(幸好我没去 一开始被BCDcode那题的思路带歪了..后来发现得把n转成二进制才能搞TAT 题目大概是要求一种类似逆序对的鬼东西: 有一个长 ...

  2. Victor and World(spfa+状态压缩dp)

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=5418 Victor and World Time Limit: 4000/2000 MS (Java/ ...

  3. android组件化方案、二维码扫码、Kotlin新闻客户端、动画特效等源码

    Android精选源码 CalendarView日历选择器 android下拉刷新动画效果代码 一个非常方便的fragment页面框架 android组件化方案源码 Zxing实现二维码条形码的扫描和 ...

  4. c#委托事件入门--第二讲:事件入门

    上文 c#委托事件入门--第一讲:委托入门 中和大家介绍了委托,学习委托必不可少的就要说下事件.以下思明仍然从事件是什么.为什么用事件.怎么实现事件和总结介绍一下事件 1.事件是什么:. 1.1 NE ...

  5. JavaScript八张思维导图—Date用法

    JS基本概念 JS操作符 JS基本语句 JS数组用法 Date用法 JS字符串用法 JS编程风格 JS编程实践 不知不觉做前端已经五年多了,无论是从最初的jQuery还是现在火热的Angular,Vu ...

  6. Spark算子--union、intersection、subtract

    转载请标明出处http://www.cnblogs.com/haozhengfei/p/252bcc1d1ab30c430d347279d5827615.html union.intersection ...

  7. php短信接口代码

    这篇文章主要为大家详细介绍了php短信接口代码,php短信发送.php批量发送.php获取余额等代码,感兴趣的小伙伴们可以参考一下 本文实例为大家分享了几个常用的php短信接口代码,供大家参考,具体内 ...

  8. 织梦dedecms如何去除版权中的Power by DedeCms

    很多站长在使用dedecms建站过程中,很多人都会调用到dedecms自带的powerby标签,这样在版权信息中就会多出Power by DedeCms这个连接.今天教大家如何去除. 工具/原料 de ...

  9. phpmyadmin 自动登录的办法

    在本地开发php项目中,需要配合使用mysql在线管理系统phpmyadmin,因为经常使用,就不想每次都输入密码,所以想办法把用户名密码写入配置文件中,让每次都可以自动登录. 工具/原料   代码编 ...

  10. 什么是redis,redis能做什么,redis应用场景

    Redis是一个key-value存储系统.Redis的出现,很大程度补偿了memcached这类key/value存储的不足,在部分场合可以对关系数据库起到很好的补充作用.这篇文章小编为大家分享了在 ...