Search code examples
jqueryeasing

How can I call my own custom easing shape?

This is my animation:

elem.animate({ left: stepLeft + "px" }, timing, "MyOwnEasingFunction", function () {
    // somethings
});

and I want to replace MyOwnEasingFunction with my own function, which use this easing:

$.easing.bw = function(x, t, b, c, d) {
    ts=(t/=d)*t;
    tc=ts*t;
    return b+c*(25.8*tc*ts + -78.5*ts*ts + 89.6*tc + -47.4*ts + 11.50*t);   
}

but how can I call it?

Solution

  • Looking at jQuery easing function — variables' comprehension it would be in the following format

    $.extend(jQuery.easing,{MyOwnEasingFunction:function(x, t, b, c, d) {
    ts=(t/=d)*t;
    tc=ts*t;
    return b+c*(25.8*tc*ts + -78.5*ts*ts + 89.6*tc + -47.4*ts + 11.50*t);   
}});

elem.animate({ left: stepLeft + "px" }, timing, "MyOwnEasingFunction", function () {
   // somethings
});

    Fiddle here: http://fiddle.jshell.net/mme7dhx8/