即插即用 js隐藏与显示回到顶部(返回顶部)按钮

老白 3年前 995浏览 0评论

之前分享过几篇都是关于返回顶部的JQery和javascript代码,今天再来分享一个!

1、jQuery:即插即用 返回顶部

2、即插即用 javascript实现滚动下拉一定高度后显示返回顶部,默认不显示

今天要分享的返回顶部也很简单:

window.onscroll = function () {

    if (document.documentElement.scrollTop + document.body.scrollTop > 100) {

        document.getElementById("scrollto").style.display = "block";

    }

    else {

        document.getElementById("scrollto").style.display = "none";

    }

}

scrollto 为页面上“回到顶部”的容器(div标签)

比如:<div id="serollto">返回顶部</div>即可制作出返回顶部的功能!

其实对于返回顶部,使用这样简单的即插即用JS代码,最为方便!

发表评论