Choosing the right jQuery easing function

When I animate elements in jQuery I often find myself looking for a little something more than the default "swing" and "linear" values. So to spice things up, I usually download this jQuery easing plugin. Once you include it in your project you have many more options to choose from.

Some animations need playfulness while others need polish. I find the easiest way to pick the right easing algorithm is to temporarily create a selectbox that displays on the page, so you can tweak and test the value on the fly. This is also useful if you want a designer's input, they can easily see what's available and pick the one they like best.

To streamline the process I created a simple jQuery plugin that generates a selectbox based on the $.easing object. It just spits out all the potential values, and then you can test them out in your animation without having to constantly update your code. You can find the extension here.

And here's an example of the plugin in action testing an animation.

Updated 01-21-2013: Changed the example page in the post to point to a nicer demo. Updated the extension on github to allow for a callback function, and linked to it in the post.