jQuery回顶部

黄良钵

分类： 程序开发 1019 1

  1. <!-- 返回顶部 -->
  2. <div class="flex align-items-center justify-content-center goTop">回顶部</div>
  1. $(window).scroll(function () {
  2.     /* 判断滚动条 距离页面顶部的距离 100可以自定义*/
  3.     if ($(window).scrollTop() > 100) {
  4.         $(".goTop").fadeIn(100); /* 这里用.show()也可以 只是效果太丑 */
  5.         $('.goTop').css({
  6.             display: 'flex'
  7.         })
  8.     } else {
  9.         $(".goTop").fadeOut(100);
  10.     }
  11. });
  13. // 回顶部
  14. $('.goTop').click(function () {
  15.     $('body,html').animate({
  16.         scrollTop: 0
  17.     }, 500);
  18.     return false;
  19. })

版权声明: 本站文章除特别声明外，均为本站原创。转载请注明出处，谢谢。

本文地址: https://huangliangbo.com/1710

  • 0人 Love
  • 0人 Haha
  • 0人 Wow
  • 0人 Sad
  • 0人 Angry
jQuery、回顶部

作者简介： 黄良钵

打赏

博客站长，前端开发工程师

共 1 条评论关于 “jQuery回顶部”

Loading...