当前位置：Gxlcms > JavaScript > 用原生js做个简单的滑动效果的回到顶部_javascript技巧

用原生js做个简单的滑动效果的回到顶部_javascript技巧

时间：2021-07-01 10:21:17 帮助过：18人阅读

很多网页在下方都会放置一个“返回顶部”按钮，尤其是页面底部没有导航的网页，这样可以帮助访客重新找到导航或者重温一遍广告（想得真美）。随着近几年来 JavaScript 的应用日渐广泛，滑动效果无处不在，于是我也跟跟风，将返回顶部功能做成了滑动效果。后来为了更贴合物理特征，改造做成了减速的滑动效果。

首先说一下原理吧，我们会获取滚动条到页面顶部的距离，然后上移一定的距离；再获取滚动条到页面顶部的距离，上移一定的距离（比上一次小一点）;以此类推 ...

document.documentElement.scrollTop, document.body.scrollTop, window.scrollY 其实都是一样的，但它们只在某些浏览器中起作用。至于那哪个在哪些浏览器起作用可以自己调试一下。

如何使用？

代码如下:

TOP

人气教程排行