Flash on top of jQuery dialog Flash on top of jQuery dialog jquery jquery

Flash on top of jQuery dialog


You can't put HTML in front of Flash unless you set wmode to opaque (or transparent).

With the default wmode ("window") the Flash Player takes over all rendering and user interaction in its area. So the browser can't display any HTML in that area. What wmode=" opaque" (or wmode="transparent") does is that it disables this default behavior and kind of integrates the Flash Player area in the browsers usual rendering and layering and such.

But you don't need to alter any Flash content to set wmode, since it is done in the HTML (or via SWFObject or other script that inserts the Flash object element) so if you have control over the "scripts which outputs flash elements" that you mention, you can take care of the wmode setting there.


i think i have a solution. Using the jquery-ui dialog, Spent hours and hours trying to figure this out - worked for me,

Logic was if i can't make the jquery go front, make all flash content go back. research took me to this link - finally finally it worked.

How do I programmatically set all <object>'s to have the wmode set to opaque?

function makeObjectsOpaque3() {    var elementToAppend = document.createElement('param');    elementToAppend.setAttribute('name', 'wmode');    elementToAppend.setAttribute('value', 'opaque');    var objects = document.getElementsByTagName('object');    for(var i = 0; i < objects.length; i++) {        var newObject = objects[i].cloneNode(true);        elementToAppend = elementToAppend.cloneNode(true);        newObject.appendChild(elementToAppend);        objects[i].parentNode.replaceChild(newObject, objects[i]);    }}window.onload = makeObjectsOpaque3;

and

if(window.onload) {    var onLoad = window.onload;    window.onload = function() {        onLoad();        makeObjectsOpaque3();    };} else {    window.onload = makeObjectsOpaque3;}


How about manually setting wmode to opaque with javascript after the flash has already loaded?