For some time now I have been using SWFObject to load flash objects on my web pages, it works great to avoid the ‘click to activate’ problems that affect IE6, IE7 and Opera 9+. In IE the browser displays an outline around the flash object and a tooltip ‘Click to activate’
I recently upgraded to the SWFObject 2.1, I was using the SWFObject 1.5 and I ran into a problem where the flash is outlined with a faint dotted border. The previous SWFObject code worked great no outline, also it only appeared in Firefox 3. I took a closer look and found the new version used an OBJECT tag instead of an EMBED tag in the generated HTML. The demo code provided with SWFObject did not have this outline either. By removing parameters I isolated the problem to the wmode=transparent setting. Removing it the outline disappeared but of course the flash was no longer transparent.
So with a bit of digging round the solution presented itself, you need to set the object style outline: none. Editing the sites style sheet is an option but I think this behaviour should be corrected in SWFObject as one of the reasons for using it is to avoid the border in the first place. Maybe they will fix it. Another way to fix this if you use a component based approach is to use SWFObject to fix the problem.
| <script type="text/javascript"> |
| swfobject.embedSWF("test.swf", "myContent", "300", "120", "9.0.0", "expressInstall.swf"); |
| swfobject.createCSS("#myContent","outline:none"); |
| </script> |
Sunday August 3 2008 10:10 a.m.