I've found that on Firefox and IE, lightbox will not render "over" Flash objects. So I added some code to hide them.

At the top of showLightbox()

embeds = document.getElementsByTagName('embed');
for(i = 0; i < embeds.length; i++) {
    embeds[i].style.visibility = 'hidden';
}

At the top of hideLightbox():

embeds = document.getElementsByTagName('embed');
for(i = 0; i < embeds.length; i++) {
    embeds[i].style.visibility = 'visible';
}

This is almost verbatim from code I found here.

Example of the revised version in action here

Comments

bugz_nz’s picture

bugz_nz commented

Thank you for taking the time to post this, I will have a look at it and apply it if it solves the issue.

elhombresinatributos’s picture

elhombresinatributos commented

Hi.

Depending on how you insert the flash and if you use IE or Firefox you need to insert this code:

embeds = document.getElementsByTagName('embed');
for(i = 0; i < embeds.length; i++) {
embeds[i].style.visibility = 'hidden';
}
objects = document.getElementsByTagName('object');
for(i = 0; i < objects.length; i++) {
objects[i].style.visibility = 'hidden';
}

And the same one changing "hidden" for "visible".

Also, for patching the lightbox.js (not the lite version) you can add the code in this places:

	end: function() {
		embeds = document.getElementsByTagName('embed');
		for(i = 0; i < embeds.length; i++) {
		embeds[i].style.visibility = 'visible';
		}
		objects = document.getElementsByTagName('object');
		for(i = 0; i < objects.length; i++) {
		objects[i].style.visibility = 'visible';
		}
		this.disableKeyboardNav();
		Element.hide('lightbox');
		new Effect.Fade('overlay', { duration: 0.2});
		showSelectBoxes();
	}

and...

	start: function(imageLink) {	
		embeds = document.getElementsByTagName('embed');
		for(i = 0; i < embeds.length; i++) {
		embeds[i].style.visibility = 'hidden';
		}
		objects = document.getElementsByTagName('object');
		for(i = 0; i < objects.length; i++) {
		objects[i].style.visibility = 'hidden';
		}
		hideSelectBoxes();
DON'T FORGET THE REST OF THE FUNCTION CODE
elhombresinatributos’s picture

elhombresinatributos commented
Status: Active » Closed (fixed)

HEY! Forget about patching. I've found a much better solution in SitePoint.

The easiest way to hide flash content is just addign the param wmode-transparent to the flash itself. This lefts the javascript untouched.

Example:

<param name="wmode" value="transparent" />
<EMBED src="whateverfile.swf" quality=best bgcolor=#FFFFFF wmode="transparent" WIDTH="550" ...

It works for me in IE and FF.

drumdance’s picture

drumdance commented

Good idea. The only issue is that I believe YouTube and Google video don't do this by default, so if you want to allow users to post videos like this, you'll have to manually add that param after the fact.

elhombresinatributos’s picture

elhombresinatributos commented

Well, my site doesn't allow users to post, so there's no problem with this for me. I hope you can find a solution.

renato_chromee’s picture

renato_chromee commented

Now, I see the same problem with Google Chrome 0.2.149.29!
Flash is still bright on top when Lightbox should darken the page.

Cheers
Renato

stella’s picture

stella commented

renato_chromee: please open a separate ticket for your issue. This one is dated 2006! And was for a completely different version of the lightbox2 module. Please provide details of your lightbox2 settings, the browsers/platforms the issues occur on and a link to your site if possible.

Cheers,
Stella

janmech’s picture

janmech commented
Component: Code » Documentation
Assigned: Unassigned » janmech
Category: bug » task

lightbox and lightbox2 offer an easy way to hide flash or any other elements: just add class="lightbox_hidden" to any element that shall be hidden when the lighbox-overlay is visible.