Senin, 21 Desember 2009

SImple Animation Menu

Thanks to the magic of the jQuery Easing plugin, we can now use easing outside of Flash and Actionscript environments. Download it on the official project site.

Step 1 – Set up the Structure

Before starting with any jQuery, we’ve got to build a quick menu structure with XHTML and load in the required project files. Make new XHTML, CSS, and javascript documents. I’ve chosen to name each of mine “animated-menu”. Make two folders in the root directory for images and javascript. I’ve attached a screenshot of my folder structure to clarify: Animated Menu Folder Nothing out of the ordinary here. Start by loading in the necessary libraries and external files in the head. I have chosen to load jQuery from the Google code archive online, while the easing plugin from above is placed into the “js” folder. The order of loading is important!