jquery實現頁面置頂功能代碼

時間 2019-12-07

原文原文鏈接

<html>
<head>
 <title></title><script type='text/javascript>
//回到頂部功能  
function gotoTop(min_height) {
    $("#toTop").click(//定義返回頂部點擊向上滾動的動畫
        function () {
            $('html,body').animate({ scrollTop: 0 }, 700);
        });
    //獲取頁面的最小高度，無傳入值則默認爲600像素
    min_height ? min_height = min_height : min_height = 600;
    //爲窗口的scroll事件綁定處理函數
    $(window).scroll(function () {
        //獲取窗口的滾動條的垂直位置
        var s = $(window).scrollTop();
        //當窗口的滾動條的垂直位置大於頁面的最小高度時，讓返回頂部元素漸現，不然漸隱
        if (s > min_height) {
            $("#totop").fadeIn(100);
        } else {
            $("#toTop").fadeOut(200);
        };
    });
};
</script>'
 </head>
    <body>
       <div id='toTop' ></div>
   </body>
</html>

相關標籤/搜索