跨页面锚点定位与滑动到一定距离出现回到顶部按钮
从页面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>