I am currently working on a website for a client and one of their requests was that their home page have some animation featuring some of their promotions. Now I know the first thing you are saying is "please, God, say it aint so, not FLASH!" Yes I know flash is evil, I absolutely hate it but in this instance it is the best tool for the job.
I won't tell you how annoying the software is to make a flash movie but I will tell you how annoying it is to simply embed a flash file in your web page using valid HTML.
Here is the jist of what I needed to accomplish:
- Valid HTML
- A movie that doesn't repeat
- A movie with a clickable link/region
- A movie with a transparent background
- Avoid annoying "Click to activate this control" in Internet Explorer
After that I tried simply hardcoding the html into the webpage. This worked fine in IE but Firefox and the likes required the noncompliant EMBED tag to make it work. Even worse was I was now faced with the annoying Click to activate this control problem in Internet Explorer.
Everything worked now, except the code technically wasn't valid HTML even though the W3C validator said so. Then today I read this article on Alistapart and specifically this comment. After that it all made sense to me. After hours of toiling I had found the solution and everybody was wrong!
This code not only validates but it works. The only drawback here is we still have the annoying click to activate this control problem in Internet Explorer. The trick here was to remove the ClassID attribute since that stopped it from working in Firefox and adding the DATA attribute.
<object type="application/x-shockwave-flash" data="/yourfile.swf"> <param name="movie" value="/yourfile.swf"> <param name="loop" value="false"> <param name="wmode" value="transparent"> </object>
Embeding Flash Without Click To Active And Using Valid HTML
Simply place this script in an external .JS file and call it using the bottom function. Viola, no more click to activate, transparent background, doesn't repeat, and work fine in all browsers without the stupid EMBED tag and without annoying conditional comments for IE.