jQuery滚动到顶部插件scrollUp

来源：互联网发布：淘宝火锅底料编辑：程序博客网时间：2024/06/03 15:19

演示下载

当网页内容过长，你浏览到底部需要回到顶部时，是不是希望“一键直达”呢？scrollUp 就是这样一款插件，它能够让用户滚动条滚动到一定的位置时（可设置），右下角出现“滚动到顶部”的按钮，点击后，页面就是慢慢的滚动到顶部，而不是硬生生的直接回到顶部，提高了用户体验。

scrollUp 还提供了 3 种主题，在 css 文件夹下。当然你可以自定义。

使用方法

引入文件

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

JavaScript

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

参数

参数说明scrollName绑定 id，默认为 scrollUptopDistance滚动条距离顶部多少距离时出现按钮，单位为 px，默认为 300topSpeed滚动到顶部的时间，单位为 ms，默认为 300animation按钮出现、隐藏的方式，可选 fade（淡入淡出）、slide（滑块）或 none（无）animationInSpeed按钮出现的时间animationOutSpeed按钮隐藏的时间scrollText按钮内的文字，默认为 Scroll to topactiveOverlay是否显示参考线，值为十六进制颜色值或 false，默认为 false

自定义

你可以通过 CSS 自定义按钮，让按钮更适合你的项目。例如：

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

演示下载

标签：jQuery插件

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

0 0