跨页面锚点定位与滑动到一定距离出现回到顶部按钮

从页面1跳转到页面2，需要定位到页面2的某个地方

页面1代码：<a href="yemian2.html#1"></a>

页面2要被定位显示的地方外套一个ID为1的div

页面2代码：<div id="1">

                      <a href="#1"></a>

                      <div>我是要被定位显示的地方</div>

                </div>

 

 滑动一定距离才会出现回到顶部按钮

jquery代码:

 

$(window).bind('scroll', function () {
　　var juli = $(document).scrollTop();//获取当前滑动条距离顶部的距离
　　if (juli > 500) {　　　　　　　　　  //判断滑动条与顶端的距离是不是大于500
　　　　$(".hdb").show();　　　　　　 //如果大于500，显示回到顶部的按钮
　　}
　　else {
　　　　$(".hdb").hide();　　　　　　  //如果小于500，隐藏回到顶部的按钮
　　}
});

点击回到顶部【动态】： 

$(".hdb").click(function () {
　　$('body,html').animate({ scrollTop: 0 }, 1000);
});

 

PS：回到顶部按钮：<a href="#" class="hdb" style="display: none;">回到顶部</a>

转载于:https://www.cnblogs.com/123lucy/p/6439356.html