jquery animate not working with easing other than linear

tushar.dahiwale picture tushar.dahiwale · May 28, 2013 · Viewed 8.6k times · Source

i have written jquery to animate one div and it works fine if i don't mention any easing effect, or if i mention 'linear' but i want 'easeInOutBack' easing effect here and can't understand what is going wrong.

Hope someone tells me where i am missing out something.

Please give solutions in a simple language if possible because i am new to jQuery. :) :|

$(document).ready(function (e) {
    $('div.button').on('click', function () {
        $('div.box').animate({
            marginLeft: 200
        }, {
            duration: 2000,
            easing: 'easeOutBack'
        });
    });
});  

Is not working for me.

Answer

Mohammad Adil picture Mohammad Adil · May 28, 2013

You need to include jquery UI for that

From docs:

The only easing implementations in the jQuery library are the default, called swing, and one that progresses at a constant pace, called linear. More easing functions are available with the use of plug-ins, most notably the jQuery UI suite.