The question of how to animate an element using floats, or floated elements (ie. float: left, float: right), was posed on Quora the other day and it inspired me to make a quick plugin to achieve this simple task. Out of the box jQuery doesn't support animating a float postion to the right or left; thus a plugin is born.

I'll note that I made this as a jQuery 1.5 plugin. You'll notice I make good use of the sub() function found in latest version of jQuery. Going forward you should see more plugin authors using this kind of structure.

<iframe style="width: 100%; height: 580px;border:1px solid #ccc;padding:1px;" src="http://jsfiddle.net/darcyclarke/m9pTN/embedded/"></iframe>

You'll notice that I create an instance of the jQuery object using sub() and then alias it within the variable $plugin. I can now use my modified version of jQuery's native animate() outside of the anonymous function if I wanted to. Being able to modify native jQuery methods comes in handy and should be really exciting for plugin authors.

Click on the "Result" tab of the embedded JS Fiddle code example to get the full effect of the animation in action.