Wednesday, July 8, 2009

Create Flash Page Peel Effects for your website

If you are wondering how some web page create this little peel away effect on the top right corner of their website, that means it is successfully getting your attention and we assume that’ll make visitors curiously wanting to peel it off and see what’s in store.




view demo click here


This is certainly a very effective way to market products and bring more attention to pages you want visitors to focus.


1. Download required files


Download peel.zip and, extract it. Your peel/ folder should contain these following files:

* pageear_b.swf

* pageear_b.jpg

* pageear_s.swf

* pageear_s.jpg

*pageear.js


Plan where you should upload this folder at later stage. For webpage users, you are suggested to upload peel/ inside wp-content/themes/your_current_theme/. Fow now, let’s fire up your favorite text and image editor.


2. Edit pageear.js


Open peel.js with your favorite text editor. Change these following settings:


1. jaaspeel.ad_url – URL you intend to point to.

2. jaaspeel.small_path – Path to pageear_s.swf

3. jaaspeel.small_image – Path to pageear_s.jpg

4. jaaspeel.big_path – Path to pageear_b.swf

5. jaaspeel.big_image – Path to pageear_b.jpg

3. Edit the images


* pageear_s.jpg – The small background visitors see before content behind gets revealed. Edit if you’d like to match it with your background.

* pageear_b.jpg– What visitors will see after pointing their mouse to ‘peel the page off’. This is the image you’ll want to edit.



Both flash files, pageear_s.swf and pageear_b.swf can be left un-touch.


4. Upload files


Upload the entire peel/ folder to via FTP your web account. Make sure it matches with the settings you’ve entered earlier in Step 2.


5. Add Javascript in header


Add the following Javascript after <title> before </head>.


Labels: ,



0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]

<< Home