626 views
in Articles by
Have you seen one of those post-it pop-up? The one that looks so realistic, with awesome shadow effect. If you don't know what I am talking about, try opening the following website:

http://myhobbybooks.com/wowpop

They look awesome don't they?

And something like this is always good for your web marketing campaign. One reason, it never gets blocked by pop-up blockers. And another, it really grabs the attention of your web visitors.

This is good when you want to increase subscription rate to your ezine, or promote an affiliate program, or even increase sales.

But you wonder, how do they do it? You thought that you can achieve similar result, and you try, and try, and try... you tried GIF image, JPG image, none of those can get the job done.

But there's one thing that you just don't know. Many pro web programmers know this, but not the normal web designers ... maybe even most web designers don't know how to do this.

The secret is in PNG image format.

PNG image format is the little-known image format that you can use on the web. PNG image format is unique because you can do the Alpha effect with it. The Alpha effect is where you set transparency factor on certain areas on the PNG image. That is what makes the shadow looks so real.

With the Alpha effect, you can set transparency factor from 0% to 100%. So it can be 30% transparent, 50% or even 79%. Have a look at the pop-up again, and take a close look at the shadow - Now you know how it's done.

But there is just one problem - Internet Explorer don't really support PNG image format. While you can still call PNG image format using the IMG tag, Internet Explorer ignores Alpha factor. In Internet Explorer, PNG image just don't appear properly.

So how do we solve this ...

Luckily you can still call PNG image in Internet Explorer and have the Alpha reflected using a special CSS command. It's the AlphaImageLoader().

But this will lead to another problem. Before you can call the PNG image, you first need to identify the browser your web visitor is using. If the visitor is using Firefox, Opera, Netscape or any others, you can call the PNG using the IMG tag. But if it's Internet Explorer, you need to use the AlphaImageLoader().

And of course, this can always be solved with a bit of Javascripting. And with a little more Javascript and CSS, you can have the PNG image floating over your web content. You can even make the pop-up disappear using the OnClick event trigger.

If you'd like a complete code and PNG image to your own photorealistic post-it pop-up, try visiting WOW Pop-Up. Below is the URL address for WOW Pop-Up where you can get a free set of the code and the PNG graphic.

Please log in or register to reply to this topic.

Related topics

0 replies 731 views
0 replies 660 views
posted in Articles by HuggingDuck
0 replies 755 views
posted in Articles by HarshThunder
0 replies 769 views
posted in Articles by Knighthawk
0 replies 798 views
posted in Articles by Scorpeon
0 replies 758 views
posted in Articles by Knighttime
0 replies 814 views
0 replies 752 views
posted in Articles by SilkPredator
0 replies 721 views
0 replies 721 views
posted in Articles by LovableStorm
0 replies 693 views
0 replies 682 views
posted in Articles by Amigod
0 replies 689 views
posted in Articles by Cybora
0 replies 623 views
posted in Articles by Prepatriarch
0 replies 708 views
0 replies 624 views
posted in Articles by Explorer
0 replies 621 views
0 replies 680 views
posted in Articles by Camella
0 replies 700 views
posted in Articles by Hawkward
0 replies 678 views
0 replies 716 views
0 replies 753 views
0 replies 628 views
posted in Articles by Madept
0 replies 613 views
posted in Articles by FlamboyantChomper
0 replies 571 views
posted in Articles by AfternoonFay
0 replies 574 views
posted in Articles by PlushSeal
0 replies 637 views
posted in Articles by CheeryGrin
0 replies 700 views
posted by BeautifulWolf
0 replies 1,880 views
posted in Articles by HistoryYak
0 replies 534 views
posted in Articles by TrainedGuy
0 replies 1,708 views
0 replies 956 views
posted in Articles by KeyboardPie
0 replies 909 views
posted in Articles by SilentTrooper
0 replies 846 views
posted in Articles by OpinionOwl
...