If you've spent any time developing jQuery code that animates objects or elements on a page, you will no doubt have used either the jQuery UI or possibly a plugin, such as jQuery Easing, created by George Smith (http://gsgd.co.uk/sandbox/jquery/easing/).
Both are great ways of animating objects on a page, using easing methods such as easeIn()
or easeOutShine()
. The trouble is that both require the use of plugins, which add unnecessary baggage to our code; they are also a very safe way of achieving the effect we need. What if I said we don't need either and can produce the same effects just by using jQuery itself?
Before I go through how to do this, let's take a look at a working demo that shows this in action: