• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录

meng25

  • 博客园
  • 联系
  • 订阅
  • 管理

公告

View Post

移动端一键返回顶部

1.顶部栏给了固定高度且position:fixed,进入页面后主体部分的盒子会有上面一部分隐藏在顶部栏后--------给顶部栏和主体盒子外面的大盒子设置了display:flex就好了;

2.一键返回顶部用的window.scrollY,判断他的距离大于一个距离后返回顶部按钮再显示,否则隐藏;先在mounted()函数中设置监听事件window.addEventLister('scroll',this.handleScroll,true);

3.退出设置了监听滚动距离的页面后,在其他页面仍然在监听滚动事件,需要在相关页面设置destroyed()钩子函数,window.removeEventLister('scroll',this.handleScroll,true),删除监听器

4.点击一键返回顶部window.scrollTo(0,0)

努力向前的小菜鸡

posted on 2023-06-30 16:22  素漪  阅读(141)  评论(0)    收藏  举报

刷新页面返回顶部
 
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3