一般在比较长的页面中会有一个滚动到顶部的按钮,用户点击一下 300ms 内,会滚动到顶部,有动画效果。 一开始我想,这不是很简单,一行代码完美解决 1 $(document.documentElement).animat
一般在比较长的页面中会有一个滚动到顶部的按钮,用户点击一下 300ms 内,会滚动到顶部,有动画效果。 一开始我想,这不是很简单,一行代码完美解决
使用这个可以到顶部,但是没有动画,没有采用
等到了手机上才发现,点击居然没有反应,才发现原来是我想的太简单,一个滚动到顶部的按钮竟然有这么多兼容问题。 document.body在 手机上能用,pc 上不能用
document.documentElement在 PC 上能用,但手机上不能用
也就是说 PC 端滚动的是document.documentElement,在移动端滚动的是 document.body 如果没有一个更好的 api,那么就需要在分环境处理滚动元素,这样显的就有点麻烦。 这时候 document.scrollingElement 就出现,这个 api 就是为解决这个问题诞生的,通过 document.scrollingElement.tagName 可以看到在 PC 端是 html 在移动端是 body 。 在做解决问题的时候,搜索到一个 api
以为 js 良心发现,提供了一个这么好用的 api,可以滚动到顶部,还有动画,查看兼容性的时候, ios 居然不支持,害,果然就没有好事情。 所以在遇到滚动到顶部时,document.scrollingElement 除了 IE 和 opera 和部分低版本浏览器不支持外,可以基本满足需求。 |
2021-06-04
2019-01-10
2019-02-17
2021-09-12
2021-09-30