实现监听 页面在竖直方向的滚动,并触发显示回到顶部按钮, 点击按钮页面滚动回页面顶部
====JQ====
var offset = 200; // 显示back-to-top
var offset2 = 430; // 显示contact-us
var duration = 500;
$(window).scroll(function() {
if ($(this).scrollTop() > offset) {
$('.back-to-top').fadeIn(400);
} else {
$('.back-to-top').fadeOut(400);
}
if ($(this).scrollTop() > offset2) {
$('.contact-us-right').fadeIn(400);
} else {
$('.contact-us-right').fadeOut(400);
}
});
// 点击回到顶部
$('.back-to-top').on('click',
function(event) {
event.preventDefault();
$('html, body').animate({
scrollTop: 0
},
600);
return false;
});
====html====
<html>
<body>
<!-- 返回顶部 -->
<a href="#" class="back-to-top"> <img src="/img/contact-us-right/back-to-up.png" alt="" /> </a>
</body>
</html>