Flash on Top of Flash
At work we just implemented a ‘Corner Peel’ Flash Advertisement. You can view an example over at the Moscow-Pullman Daily News. I had a problem when putting this ‘Corner Peel’ flash ad onto the home page, you see we run a handful of advertisements of various sizes throughout our website. One of those being a leaderboard ad (728 x 90 px). When the corner peel is ‘peeled back’ it lays on top of the leaderboard.
When I saw this for the first time, the leaderboard advertisement was a flash ad and was laying on top of the corner peel ad and thus looked very funny. This little problem caused me quite the headache today. I thought I’d show you the little trick that saved me an even bigger headache.
There is a little know attribute for the object and embed tags called ‘wmode’. If you set ‘wmode’ to ‘transparent’ in both the embed tag and the as a parameter inside the object tag. It allows for transparent flash animations and also fixed my little overlay problem.
If transparency isn’t an option (i.e. you don’t want the html behind the flash file to show through), you can also set wmode to opaque. This should fix your flash on top of flash problem while still preserving you flash file’s background.
Inside the object tag:
<param name="wmode" value="opaque">
or
<param name="wmode" value="transparent">
Inside the embed tag
wmode="opaque"
or
wmode="transparent"
Now, I’m not sure if this little guy is a valid attribute or not, but I do know that it saved my ass today and I’ll risk not validating for that.
Tags: flash, adobe, wmode, transparent, leaderboard, corner peel, advertisement
Similar Posts:
- I’m Part of the Cool Crowd Now
- Goodbye Macromedia, It’s Been Fun
- CSS Box Model
- Make changes to your putty configuration stick
- Adsense Referral Program
If you enjoyed this post, please consider leaving a comment or subscribe to the feed and get future articles delivered to your feed reader.
As far as covering up the other ads, I didn’t think it was too big of an issue. I’m actually impressed with how it turned out. I like the effect a lot but whats with that horrible font thats being used? It makes me shudder.
Did he use a template or is that a secret?
I honestly don’t know if the guy that built it is using a template or not. The ad looks pretty good…I have to admit.
I like the ad as well. It’s obtrusive in any way. I think it’s funny they link to a 3 MB pdf though.
It’s *Not* obtrusive in any way.
I was against it when the initial idea came up, but after seeing it up and running, I’m surprised at how good it looks.
Tim said it best:
“People like to see bling, and that is exactly what that is.”
Looks really nice, j3ph. I agree w/Josh on the font choice for the tent sale ad though. Icky. I also agree w/jgasm on the retardedness of linking to a big ol’ pdf. And, that the effect isn’t really too obtrusive. A little annoying maybe, but a whole lot better than a big old popup window…
Bling. Flash. Bling.
Not to nit-pick, but does the top ad bleed over onto the bottom ad in everybody’s browser? I can’t really explain it, so I did a screen cap to show what I mean. I stuck it here. No big deal, was jus’ wunderin’. Note the CPU usage, too — peaks at around 90% when mousing over the bling-peel.
The interesting thing about some of the other ads staying on top of the corner peel. None of them were built by our designers. They were all built by advertising agencies. This leads me to believe that maybe this “wmode” attribute only works with certain versions of Flash? I’ll need to do some more research first, but that’s what it appears to be.