Creating A Page Peel Effect With jQuery & CSS
11
May
Page Peel effects can be very useful as they create new areas -which are mostly used for banners- on websites.
In general, they are created with the help of Flash but Soh Tanaka is featuring a a very nice tutorial on creating a page peel effect with jQuery & CSS.
The logic of the effect is simple & smart. It is created by animating the size & position of a peel image which is originally positioned over the content to be shown.
To see a demo for this nice tutorial, click here.
Requirements: jQuery
Compatibility: All Major Browsers
Website: http://www.sohtanaka.com/web-design/simple-page-peel...
Demo: http://www.sohtanaka.com/web-design/examples/peeling...
Compatibility: All Major Browsers
Website: http://www.sohtanaka.com/web-design/simple-page-peel...
Demo: http://www.sohtanaka.com/web-design/examples/peeling...
- Tags:
Banner Javascript
- Filed under: Banner, Browsing, Goodies, License Free
- 10 Comments
10 Responses for "Creating A Page Peel Effect With jQuery & CSS"
great information .thanks
Very cool technique. I can’t wait until I have a chance to use it.
Awesome. Find it a long time for my advertisements. Thanks a lot.
Where would we be without jQuery, thanks a lot!
quite cool! i’d like to use it in my nxt websyt..
Hi, nice … but it does´not work with iPad?
nice technique, however you cant align PNG’s to the right as background images in IE6 and below…using a GIF in that situation would suffice.
Page peels for everyone… thanks for putting the article together.
Didn’t realise how much good stuff there is on this site, I could spend a week looking through all the goodies.
Definitely the best peel effect on the web. I’ve been looking for this for a while. And, BTW, beautiful footer!
Great tool…definantly will come in handy for some of my projects…not so worried about ipad users…careless about IE6 issue…so overall cool tool…