首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >【JavaScript】给你的网站加一个简单的返回顶部

【JavaScript】给你的网站加一个简单的返回顶部

作者头像
NorthS
发布2023-03-21 21:04:09
发布2023-03-21 21:04:09
8590
举报
文章被收录于专栏:北冥博客北冥博客

工具:灵巧的小手 要实现的功能分别为: 1.当滑动到一定位置,返回顶部按钮的显示与消失。(用if判断) 2.点击返回顶部按钮,返回到顶部。(使用window.scroll(0,0))

css和html部分:

首先我们的页面需要一个返回顶部的按钮,用户用来点击(必须使用固定定位定位不然它就跟页面走了,然后在css中让它的display: none;)。

js部分:

获取按钮,body主页高度,通过window.pageYOffset 获取滑动的高度, 滑动大于1/3时,让它显示,小于隐藏 点击返回顶部使用window.scroll(0,0)

温馨提示:本文最后更新于2021-11-18,若文件或内容有错误或已失效,请在下方留言

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021年11月18日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • css和html部分:
  • js部分:
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档