Posts Tagged ‘xhtml’
Webpage content underneath Flash content
So, you’ve got a website that you’ve made and you’ve used a Flash movie on it. Okay, no worries. Now, what if you tried to add a (non-form-element) drop-down menu or some AJAX-ed content into the site, and found the Flash movie actually acted as an overlay?
This problem doesn’t seem consistent. Different OSs, browsers, and Flash versions don’t indicate consistency – that’s what I’ve seen anyway. Nevertheless, the problem persists for some users and it’s down-right annoying.
The fix? Make your Flash code look similar to this:
<object data="my-movie.swf" type="application/x-shockwave-flash" height="100" width="200"> <param name="movie" value="my-movie.swf" /> <param name="quality" value="high" /> <param name="embed" value="transparent" /> <param name="wmode" value="transparent" /> <param name="menu" value="false" /> <img src="alternate.jpg" alt="ARCS - Revolutionising Collaboration" height="100" width="200" /> </object>
That there should be entirely XHTML compliant (and completely cross-browser compatible) code for creating a Flash object on your page that’ll place nice with other content.
Plone How-To: XHTML Compliant Flash Insertion
Wow, it seems easy doesn’t it. Just add an object tag, params, and embed and we’re done, right? Well, sure, if we didn’t want to adhere to W3C standards.
To do the right thing, we need something like this:
<object type="application/x-shockwave-flash" data="movie.swf" width="100" height="100"> <param name="movie" value="movie.swf" /> <img src="alt.jpg" width="100" height="100" alt="" /> </object>
Not much to it there, and this is available everywhere on the web. It validates okay, and that’s what we need.
However, if you follow normal procedure for sticking this in Plone (disable filtering of the relevant object and param tags in HTML Filtering (Plone Control Panel), then make a Page with this code), you’ll see it won’t work in IE.
Much hair-tearing and searching led me to find that the rendered Page is missing the param tag in the source XHTML. Huh?!?, you say – I just disabled the filtering. Why’s it not there?!.
Sure, you did. What noone told you is that you need to go into the ZMI -> portal_transforms -> safe_html and tell Plone that the param tag is an empty tag (like <img />). In the list of valid_tags, set param to be 0. Save this page.
Now try it again in IE. Looking at the source in both should show the param tag now, and your Flash should show up just fine once you convince IE to refresh.