Search code examples
jqueryjquery-uijquery-pluginseasing

jQuery easing animation between show/hide

I have a form that uses show/hide to display various content. I'd like to use some sort of an easing method for the transition. Ideally, it would "grow" bigger if the new content being shown is bigger than the previous or something of the sort.

I've looked at the easing plugin, but I don't see how you can apply it to a transition of show/hide... I'm lost.

Any help would be awesome.

Thank you!

Solution

  • since jQuery 1.4.3 you can add easing to the show function like so 

    .show( [duration,] [easing,] [callback] )

    where [easing] is a string that represents an easing method. With standard jquery there are two easing types 'swing' and 'linear' but you can find more in jQuery UI.

    more info in the documentation