jQuery滾動到頂部插件scrollUp

演 示 下 載

當網頁內容過長，你瀏覽到底部需要回到頂部時，是不是希望“一鍵直達”呢？scrollUp 就是這樣一款插件，它能夠讓用戶滾動條滾動到一定的位置時（可設置），右下角出現“滾動到頂部”的按鈕，點擊後，頁面就是慢慢的滾動到頂部，而不是硬生生的直接回到頂部，提高了用戶體驗。

scrollUp 還提供了 3 種主題，在 css 文件夾下。當然你可以自定義。

使用方法

引入文件

<script src="js/jquery.min.js"></script>
<script src="js/jquery.scrollUp.min.js"></script>

JavaScript

$(function () {
    $.scrollUp();
});

參數

參數	說明
scrollName	綁定 id，默認爲 scrollUp
topDistance	滾動條距離頂部多少距離時出現按鈕，單位爲 px，默認爲 300
topSpeed	滾動到頂部的時間，單位爲 ms，默認爲 300
animation	按鈕出現、隱藏的方式，可選 fade（淡入淡出）、slide（滑塊）或 none（無）
animationInSpeed	按鈕出現的時間
animationOutSpeed	按鈕隱藏的時間
scrollText	按鈕內的文字，默認爲 Scroll to top
activeOverlay	是否顯示參考線，值爲十六進制顏色值或 false，默認爲 false

自定義

你可以通過 CSS 自定義按鈕，讓按鈕更適合你的項目。例如：

#scrollUp {
    bottom: 20px;
    right: 20px;
    padding: 10px 20px;
    background: #555;
    color: #fff;
}

演 示 下 載

標籤：jQuery插件

http://www.dowebok.com/9.html