Geek Answers Handbook

JQuery ScrollTo Easing

Cannot apply easing method to Jquery ScrollTo:

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

It doesn’t make anything easier ... I started using jquery now (I used the prototype for a long time), so this is definitely my mistake. Do I need a plugin to facilitate? What is the option to weaken this plugin (if any)? This is not clear in the documentation. Thanks.

+7
jquery scrollto easing-functions
source share
4 answers

From jQuery:

The only debilitating implementations in the jQuery library are the default values ​​called swing, and one that progresses at a constant rate, called linear .

So easing: 'linear' should not show anything. Try easing: 'swing' .

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

And a large list of mitigations can be found here:

http://easings.net/

+5
source share

linear is the default option for ease: linear animation => straight to the point in a second.

try easing:'elasout'

+1
source share

I know this is an old thread, but I found it and it helped me. As Palmsey mentioned in one of the comments, the scrollTo daemon shows an example of using easing, but doesn’t actually mention that it borrowed a small piece of code from the plugin found in http://gsgd.co.uk/sandbox/jquery/easing/ . The scrollTo demo 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*ds)*(2*Math.PI)/p ) + c + b; };

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

+1
source share

More articles:


All Articles