点击返回顶部(置顶)

最新推荐文章于 2022-05-17 20:33:28 发布

原创最新推荐文章于 2022-05-17 20:33:28 发布 · 561 阅读

1 ·

CC 4.0 BY-SA版权

js 同时被 2 个专栏收录

19 篇文章

订阅专栏

Vue

16 篇文章

订阅专栏

vue方法(2019-07-06)

goTop() {
      this.timer = setInterval(this.FourscrollBy, 10);
    },
    FourscrollBy(eachHeight) {
      if (document.documentElement && document.documentElement.scrollTop) {
        //IE
        if (document.documentElement.scrollTop <= 0) {
          clearInterval(this.timer);
        } else {
          window.scrollBy(0, -50);
        }
      } else {
        //Chrome不支持documentElement.scrollTop
        if (document.body.scrollTop <= 0) {
          clearInterval(this.timer);
        } else {
          window.scrollBy(0, -50);
        }
      }
    }

jq方法(2019-01-26)
html:

<!--返回顶部-->
		<div class="back-top" style="display: none;">
			<img src="static/images/BackTop.png" />
		</div>

css:

.back-top{position: fixed;
    right: 15%;
    bottom: 10%;
    cursor: pointer;
    z-index: 9999;}

js:

$(".back-top").on('click', function() {
					$('html,body').animate({
						scrollTop: '0px'
					}, 1000);
				});
				$(window).scroll(function() {
					var $_scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
					if($_scrollTop > 1000) {
						$(".back-top").fadeIn();
					} else {
						$(".back-top").fadeOut();
					}

				});