[BUG]document.body.scrollTop=0不生效（回到顶部）
描述
让body回滚到最顶部，设置 document.body.scrollTop = 0; 。
微信内，安卓设备可以，IOS设备不可以。
原因
MDN中 scrollTop是这样定义的
一个元素的
scrollTop值是这个元素的顶部到视口可见内容（的顶部）的距离的度量。当一个元素的内容没有产生垂直方向的滚动条，那么它的scrollTop值为0。
简单来说，scrollTop是这个元素的内容相对于自己向上滚动的高度。
ios设备中没问题，但是安卓设备 body 比较特殊，即使body没有限制高度，body的内容没有相对于自己滚动，也会有 scrollTop 值。
然而如果限制了body高度，让body的内容相对于自己滚动， ios设备中 body.scrollTop 有值， 安卓设备 body.scrollTop 始终为0。
解决方案
不使用body，在body内部设置最大容器root盒子, 然后操作root盒子。
html,
body,
#root {
height: 100%;
}
#root {
overflow: auto;
}
<body>
<div id="root">
<!-- 这里放内容 -->
</div>
</body>
document.getElementById('root').scrollTop = 0;
[BUG]document.body.scrollTop=0不生效（回到顶部）的更多相关文章
- HTML元素跟随鼠标一起移动,网页中回到顶部按钮的实现
对象跟随鼠标: 1.对象css设置绝对定位position: absolute; 2.获取鼠标坐标: 3.通过鼠标坐标计算出对象坐标位置,并设置为css定位的位置: document.onmousem ...
- 火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题
一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.on ...
- document.body.scrollTop 值总为0
http://www.jb51.net/article/21168.htm 页面具有 DTD(或者说指定了 DOCTYPE)时,使用 document.documentElement. 做页面 ...
- document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题
转自http://wo13145219.iteye.com/blog/2001598 一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取do ...
- document.body.scrollTop无效的解决方法
1.document.body.scrollTop = 0 有时候不生效,两种解决方案,试试看. 1-1.设置:document.documentElement.scrollTop = 0;1-2.设 ...
- document.body.scrollTop 各浏览器兼容性解决
document.compatMode:获取当前浏览器采用的渲染方式.主要是浏览器的模式,有两个:BackCompat,CSS1Compat.其中前者是怪异模式,后者是标准模式. IE默认是BackC ...
- UEditor图片焦点错位,火狐document.body.scrollTop不管用的问题
转自 http://liyunpeng.iteye.com/blog/2068751 关于 document.body.scrollTop 在火狐浏览器中不管用的问题 看网上有人写通过判断docume ...
- document.documentElement.scrollTop
要获取当前页面的滚动条纵坐标位置, 用: document.documentElement.scrollTop; 而不是: document.body.scrollTop; doc ...
- document.documentElement.scrollTop指定位置失效解决办法
近期在vue的H5项目中,做指定位置定位的时候发现使用document.documentElement.scrollTop一直不生效. 解决办法是document.documentElement.sc ...
随机推荐
- SPSS|Data|Transfer|Analysis|Label|One sample test|Testval|Criables|
生物统计与实验设计-使用SPSS Data用于整合:Transfer用于预处理:Analysis用于数据的二维呈现:Label是在报表中呈现的名字: 给离散值编码: 对于离散值做数学计算: 均值比较用 ...
- 微信小游戏广告位iphonex底部适配问题
最近在公司开发游戏,使用cocos creator做微信小游戏,遇到一个很恶心的问题,如图: 如图所示,微信的广告位被iphonex的底部bar给弹出了一点位置,没有靠在底部. 在这里不得不吐槽一下微 ...
- php 依赖注入 和 控制反转 php设计模式
https://blog.csdn.net/zyddj123/article/details/82753650 什么是依赖注入?IOC:英文全称:Inversion of Control,中文名称:控 ...
- Handler机制中的消息队列
--> 学习自蘑菇街大佬 Handler机制可以看成是一个消息阻塞队列,当有消息时立即处理消息,没有消息时则阻塞.在Android系统中APP启动后很快进入死循环,不断读取MessageQueu ...
- django中间件和auth模块
Django中间件 由django的生命周期图我们可以看出,django的中间件就类似于django的保安,请求一个相应时要先通过中间件才能到达django后端(url.views.template. ...
- spring基于@Value绑定属Bean性失
用spring注解@Value绑定属性失败 环境: eclipse Version: Luna Release (4.4.0) spring 4.0 Junit4 其他依赖包 描述: JsrDAO类, ...
- android应用程序源码结构分析
工程; 1. src文件夹存放源码. 2. gen下有跟src中一样的包文件,内部有一个名为R.java类,它是自动生成的一个类:该目录不用我们开发人员维护, 但又非常重要的目录 . 该目录用来存放由 ...
- 【C++基础】008常量和变量
简介:常量和变量. 常量和变量 1. 常量 具体把数据写出来 2,3,4: 1.2,1.3: "Hello World!","C++": cout <&l ...
- cooking和session
## Cookie ## # 基本概念: >> 用于保存一次会话中的记录,存放在客户端(浏览器); |-- "一次会话" |-- 当客户端打开一个界面时 被称作一次会话 ...
- Git 相关问题分享，git reset与git revert的区别?
1.如果我在git add 后想要撤销操作,该怎么做? 使用 git rm --cache [文件名/ *] 或者 git reset HEAD, 为什么这个命令也会有效果呢,实际上reset将 HE ...