JQ-監(jiān)聽頁面豎直方向滾動，顯示'回到頂部'按鈕

實現(xiàn)監(jiān)聽 頁面在豎直方向的滾動，并觸發(fā)顯示回到頂部按鈕， 點擊按鈕頁面滾動回頁面頂部

====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>
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容