Animate Curtains Opening with jQuery

Step 1 – What You’ll Need

This example would not be anything special without the graphics, so let’s make sure you’ve got those under control. I’ve included the ones used in demo as part of the attached files, now would be a good time to download them if you intend to use them.

Secondly, in addition to the standard jQuery file, we are also using the easing plugin. We have worked with this plugin in previous tutorials but in this case we will use it to provide a bounce effect when the rope is pulled.

IE6 Disclaimer – A few of the project images use the PNG format in order to have cleaner transparency. To keep things short, I will not be demonstrating the workaround for transparency errors in IE6. If this affects you, I recommend reading this article for a solution.


Step 2 – Setting Up the HTML