jquery平滑滚动到顶部插件使用详解
86 浏览量
2020-12-12
20:33:18
上传
评论
收藏 74KB PDF 举报
jquery平滑滚动到顶部插件使用详解平滑滚动到顶部插件使用详解
点击一个固定按钮，平滑的滚动到窗口顶部的这种功能，在前端开发是相当常见的，如图：
关键代码：
$.fn.scrollTo = function(options) {
var defaults = {
toT: 0, //滚动目标位置
durTime: 500, //过渡动画时间
delay: 30, //定时器时间
callback: null //回调函数
};
var opts = $.extend(defaults, options),
timer = null,
_this = this,
curTop = _this.scrollTop(), //滚动条当前的位置
subTop = opts.toT - curTop, //滚动条目标位置和当前位置的差值
index = 0,
dur = Math.round(opts.durTime / opts.delay),
smoothScroll = function(t) {
index++;
var per = Math.round(subTop / dur);
if (index >= dur) {
_this.scrollTop(t);
window.clearInterval(timer);
if (opts.callback && typeof opts.callback == 'function') {
opts.callback();
}
return;
} else {
_this.scrollTop(curTop + index * per);
评论0
最新资源