Div on top of flash without wmode

Question

I have AD, which is basically a flash file inside an IFRAME. Unfortunately, I can not control the wmode flash file.

Is there any way I can place a div on top of a flash?

UPDATE How does Wibiya do it (wibiya.com)?

Answer 1

You can try using the iframe hacker, which is supported in many browsers for backward compatibility reasons.

http://neugierig.org/software/chromium/notes/2009/07/windowed-windowless-plugins.html

Add an absolutely positioned empty iframe with the correct dimensions, which acts like a mask wherever you want the underlying HTML to "leak out". Vibia probably does this, although I did not look.

Closure provides a helper class for this type of thing if you are looking for inspiration: http://code.google.com/p/closure-library/source/browse/trunk/closure/goog/ui/iframemask.js

Answer 2

Nope. Windowless objects are rendered on a different “plane” for windowed objects (such as ActiveX controls, in the case of IE). Microsoft's explanation is obviously applicable only to Internet Explorer, but other browsers work in a similar way.

All window elements are painted on top of all windowless elements, despite the wishes of their container. However, window elements follow the z-index attribute with respect for each other, just like windowless elements follow the z-index attribute relative to each other.

All windowless elements are displayed on the same MSHTML plane and window elements are drawn on a separate MSHTML plane. You can use z-index to manipulate elements in one plane but not mix and match elements in different planes. You can change the z-index of elements on each plane, but the window plane always rests on top without the Window plane.

http://support.microsoft.com/kb/177378

This is actually beneficial for the advertising service - it prevents publishers from masking, covering and slightly changing their ads (for example, placing an image in front of the ad so that it merges with the site).