JQuery animation: Is it possible to change speed during the animation?

Question

I want to move a div down a page, and I want it to slow down as it reaches the target.

I tried using call back with recursive func but it doesn’t look smooth:

    function MovePanel()
        {

            sidePanel.animate({"marginTop": newCurrTop}, moveSpeed,function(){MovePanel();});

Is it possible to slow down an JQuery animation?

If not what are the alternatives?

Thanks.

Answer 1

The animate method takes a 3rd param called "easing"; learn about it here:

http://api.jquery.com/animate/

Answer 2

You might want to check this out: http://www.learningjquery.com/2009/02/quick-tip-add-easing-to-your-animations

Easing can really bring life to an effect. Easing controls how an animation progresses over time by manipulating its acceleration.