Placing HTML on top of a Flash object

Flashembed demo 4 / 6 : Placing HTML on top of a Flash object

It is possible to place HTML elements in front of the Flash movies to prevent the Flash from showing through. This is achieved by setting the wmode property to opaque. Then the Flash object can accept placement and positioning like any other element including the the z-index CSS property. Here is an example:

This feature does not work on Linux and in early versions of Opera, but browser support is still quite good.

JavaScript setup

This is our JavaScript setup:

// script inside the domReady method is executed after page is scriptable
flashembed.domReady(function() {

	// wmode parameter does the trick
	flashembed("flash", {src: "/swf/flash10.swf", wmode: 'opaque'});
});

You can find a standalone version of this example here.