Jquery ScrollTo Easing

问题

Can´t apply an easing method to Jquery ScrollTo:

$("#scroller").scrollTo(target,1000,{axis:'x',easing:'linear'});

This doesn´t ease anything... Im starting to use jquery now (been using prototype for long) so this is surely my mistake. Do I need an easing plugin to achieve this? What are the easing option for this plugin (if any)? The documentation is not clear about this. Thanks.

回答1:

From jQuery:

The only easing implementations in the jQuery library are the default, called swing, and one that progresses at a constant pace, called linear.

So easing: 'linear' is not supposed to show anything. Try easing: 'swing'.

回答2:

$("#scroller").scrollTo(target, 1000, {easing: 'easeInOutCirc'});

And a great list of easings can be found here:

http://easings.net/

回答3:

linear is the default option of easing : linear animation => straight to the point in a sec.

try easing:'elasout'

回答4:

I know this is an old thread but i found it and it helped me. As Palmsey has mentioned in the one of the comments, the scrollTo Demo shows an example of using easing, but doesn't actually mention that it has borrowed a small snippet of code from the easing plugin found at http://gsgd.co.uk/sandbox/jquery/easing/. The demo on scrollTo includes this code in the init.js file

    //borrowed from jQuery easing plugin
    //http://gsgd.co.uk/sandbox/jquery.easing.php
    $.easing.elasout = function(x, t, b, c, d) {
        var s=1.70158;var p=0;var a=c;
        if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
        if (a < Math.abs(c)) { a=c; var s=p/4; }
        else var s = p/(2*Math.PI) * Math.asin (c/a);
        return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
    };

However if you include the entire easing plugin mentioned above you can use any of the functions mentioned at http://easings.net/

来源：https://stackoverflow.com/questions/4275329/jquery-scrollto-easing