javascript - 如何通过 ScrollTo 插件使用内联缓动

Question

我尝试使用具有缓动效果的ScrollTo插件。

而且我不想包含缓动插件文件，因为我只会使用一次而且只有一种缓动效果。

我想使用这个“easeOutBack”：

easeOutBack: function (x, t, b, c, d, s) {
        if (s == undefined) s = 1.70158;
        return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
}

而我的scrollTo的功能代码就像..

$(window).scrollTo(element,800,{offset:-80,onAfter:function(){
            alert('done');
}});

所以我尝试插入一个缓动效果，比如......

$(window).scrollTo(element,800,{offset:-80,
easing:function(x, t, b, c, d){
    return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
},
onAfter:function(){
    alert('done');
}});

它不起作用。

TypeError: b.easing[this.easing] 不是函数

Answer 1

您可以简单地将缓动函数存储在$.easing：

$.easing.easeOutBack = function(x, t, b, c, d, s) {
    if(s == undefined) s = 1.70158;
    return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
};

之后，您可以像加载缓动插件时一样使用它。

直接传递函数不起作用，因为 jQueryanimate()只接受缓动函数的字符串（在 中查找$.easing）。