【教程】网页到达底部显示返回顶部二：jQuery方法

测试浏览器：chrome，jquery版本：jquery-3.3.1.min.js

ie8请使用jQuery1.9.1版本

js代码

$(window).scroll(function () {
      //已经滚动到上面的页面高度
     var scrollTop = $(this).scrollTop();
      //页面高度
     var scrollHeight = $(document).height();
       //浏览器窗口高度
     var windowHeight = $(this).height();
      //此处是滚动条到底部时候触发的事件，在这里写要加载的数据，或者是拉动滚动条的操作
      if (scrollTop + windowHeight == scrollHeight) {
        //alert('页面到底部了');
	$('#b2').css('display','block');
       }
      else {
	$('#b2').css('display','none');
       }
 });

html代码

top<a id="b1">
<div style="height:1400px;"></div>
bottom
<div id="b3" style="position:fixed;top:780px;left:1700px;">联系我们</div>
<div id="b2" style="display:none;position:fixed;top:800px;left:1700px;"><a href="#b1">返回顶部</a></div>