遇到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. UVA 1030 - Image Is Everything【模拟+思维+迭代更新】

    题目链接:uva 1030 - Image Is Everything 题目大意:有一个最大为n*n*n的立方体的一个不规整立体,由若干个1*1*1的小正方体构成(每一个小正方体被涂成不同的颜色),给 ...

  2. 关于JAVA实现二维码以及添加二维码LOGO

    今天在公司,完成了之前的任务,没有什么事做,就想鼓捣一下二维码,因为之前没有接触过,我就去翻看了几本书,也基本完成了二维码的实现,以及添加二维码的LOGO. 现在绘制二维码一般都使用的是谷歌的zxin ...

  3. 对SVD奇异值分解的理解

      首先推荐一篇博客,奇异值分解(SVD)原理详解及推导 - CSDN博客,讲解的很清楚.这里我谈谈自己的理解,方便以后回顾.   如果把向量理解为空间中的一个元素,那么矩阵可以理解为两个空间上的映射 ...

  4. [学习OpenCV攻略][005][视频播放控制]

    cvSetCaptureProperty(视频,属性,属性值) 设置视频的属性,属性可以是宏CV_CAP_PROP_POS_FRAMES 视频帧的位置 cvGetCaptureProperty(视频, ...

  5. ThinkPHP5+小程序商城 网盘视频

    ThinkPHP5+小程序商城   网盘视频  有需要联系我  QQ:1844912514

  6. addslashes() 函数返回在预定义字符之前添加反斜杠的字符串

    . 预定义字符是: 单引号(') 双引号(") 反斜杠(\) NULL 提示:该函数可用于为存储在数据库中的字符串以及数据库查询语句准备字符串. 注释:默认地,PHP 对所有的 GET.PO ...

  7. ubuntu-apache下隐藏thinkphp入口文件index.php

    按照thinkphp手册中来讲,apache服务器下,隐藏thinkphp入口文件有3步: httpd.conf配置文件中加载了mod_rewrite.so模块 AllowOverride None ...

  8. Eclipse报错An internal error occurred during: "J2EE Component Mapping Update". java.lang.NullPointerException

    Eclipse每次打开.java文件时,报错信息如下: An internal error occurred during: "J2EE Component Mapping Update&q ...

  9. 风险案例-28期-项目Leader与团队成员缺乏沟通,问题响应度较慢导致团队士气低落,工作效率低

    典型案例: A公司某C类项目目前进入开发高峰期,项目组的三个leader预计在项目的实际task投入占比为70%,剩30%工作时间用于指导组员进行作业实施并担当部分管理工作.从项目实施过程中发现Lea ...

  10. 【编程技巧】NSDate,NSDateFormatter,NSTimeInterval

    //获取日期 todaysDate=[NSDate date]; //显示日期和时间 dateFormat = [[NSDateFormatter alloc] init];//NSDate没有自己的 ...