This week I’m going to show you to make the best use of jQuery’s amazing animation features using just a few lines of code for each our examples. Did you know that you can use jQuery’s animation functions to create your very own progress-bar in less than 3 lines? or that you could use it to make your very own accordian in under 9 lines? Well, today I’m going to go through some examples of how to do these and a whole lot more.

First let’s start with some basics. What is the jQuery animate() feature?. The animate() feature allows you to create custom animations using a few lines of code – it’s key aspect is the object containing all of the style properties to be animated and to what end. Essentially this means that it allows you to specify what you want to animate and where you eventually want that item to appear. For example, if I have a div called "red" on what side of the screen, I can specify the end of the screen as an end-point and have it animate towards that point. I’m able to also say what property of the item I would like animated -eg. in the above case if I wanted to move the item towards the end of the screen..I would alter the marginLeft property from where it is right now to something larger. This is done as follows:

Related posts:

1. 12 new examples of Advanced Animation techniques with jQuery When you think about animation on the internet, chances are...
2. How to create impressive animations in jQuery with .animate() I’ve been asked many times over the past month...
3. How to enlarge images with jQuery Guest writer,  Jeffrey Jordan Way. I’ve created many tutorials...
4. jQuery UI Animation Effects The jQuery UI Effects Core brings a few more...
5. The Best Advanced Animation techniques you can perform using jQuery When you think about animation on the internet, chances are...

Related posts brought to you by Yet Another Related Posts Plugin.