Its been really long time since I wrote my last post, have been pretty busy, have learned lot of new things. hopefully will try to them with you all soon.
Recently I was asked to complete a very challenging task for one of my project – replicating a Bow Builder (already built in Flash) using HTML, JQuery & CSS.
The Bow Builder has three parts 1) a band, 2) a bow & 3) a flower, and user can select among the available color for each part.
Before starting the task I had a feeling that this is going to be a tough job and as usual I turned to “GOOGLE” for help & like most of the time I found what was needed.
The solutions I found was using different layers of div and Image masking feature and luckily I found a JQuery plugin for the same, that’s the reason I love JQuery 😉
You can see a demo of what i created here
Hope this helps someone with a same requirement, any queries please contact me and I will try to help 🙂
In this post I am sharing my source code for creating a simple, useful yet beautiful animated banner with JQuery.
Here is the source:
<div id=”imageDiv1″ class=”bottom”><img id=”image1″ src=”images/image1.gif” alt=”” /></div>
<div id=”imageDiv2″ class=”right”><img id=”image2″ src=”images/image5.gif” alt=”” /></div>
border: 1px solid #000;
Please replace the images in this file with yours.
This is really easy and very useful. If you have any queries or you face any problem feel free to contact me.
Hope this is useful for you, thanks for reading 🙂
Updated on 15th January, 2011
Now you can also see the demo here.