栏目分类:
子分类:
返回
终身学习网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
终身学习网 > IT > 软件开发 > Web开发 > Html/CSS > CSS教程

快速掌握—JS如何实现页面平滑的滚到顶部

CSS教程 更新时间:发布时间: 百科书网 趣学号

// 阻力,数值越大,滑动越慢
const drag = 10;
// 滑动到顶部
const scrollToTop = () => {
// 距离顶部的距离
  const gap = document.documentElement.scrollTop || document.body.scrollTop;
  if (gap > 0) {
    window.requestAnimationframe(scrollToTop);
    window.scrollTo(0, gap - gap / drag);
  }
};
scrollToTop();

【核心知识点】:drag越大,页面滑动速度越慢。反之,则快。

本系列旨在通过最直接的事例最完整的代码,解决一些开发中常遇到的实际问题。

如果你觉得这篇文章帮助到了你,我很高兴。

转载请注明:文章转载自 www.051e.com
本文地址:http://www.051e.com/it/241898.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 ©2023-2025 051e.com

ICP备案号:京ICP备12030808号