[Plugin: jQuery Lightbox] Pops Up Under Menu In NextGen

Greetings Ace,

The problem is with your theme CSS: the menu have Z-Index properties that make them appear over the Lightbox window!

Just change those values to smaller ones (or even remove them) and your all done! ??

Best regards,

Pedro Lamas

Hi Pedro,
Thanks for the reply.

I took out all references to z-index in the css files and cleared my cache and no go. It didn’t break anything by removing all references but it did not fix the problem. Any suggestions?

Thanks again!

AceOfJames

Ace, you still have them on this file:

https://modussystemsinc.com/wp-content/themes/ETHERNA_WP/css/style.css

Check at least the #menu references in the CSS file, they have a high z-index.

One way to solve this is to set a higher z-index on the #lightbox-overlay element; add this to the bottom of your style sheet:

#lightbox-overlay {
z-index: 2000;
}
#lightbox {
z-index: 2001;
}

I think this might solve the problem! ??

That didn’t work.. I did use some negative numbers and it kind of worked for one of the project pages.

I was hoping for a solution so that the menu did not bleed through the lightbox at all. Is this possible?

Thanks!
AceOfJames

Hey Pedro,

Sorry to bug you again but I really need a solution for the theme menu appearing in the popup.

Any other suggestions?

https://modussystemsinc.com/projects/adams-middle-school/

Thanks in advance!
AceOfJames

You aren’t buging me James! ??

Like I said, all you have to do is set the Z-Index on all the CSS entries of your style sheet!

jQuery Lightbox has a default Z-Index of 90, all your Z-Index have to be lower than that!

I’ve tested this with Google Chrome and it worked fine, so I can assure you that changing your CSS style sheet file will solve the issue! ??

Add this to the BOTTOM of your CSS style sheet file:

#menu {
	z-index: 46;
}

I think this will solve the problem!

Hey Pedro!

Thanks for the replies!

The second one work! That is awesome!

Here is the but…

But, now the dropdown menu at the top of the page under PROJECTS has an issue. The menu goes BEHIND the slider on the homepage and behind other text headers on different pages.

Is there a counter measure we can take for this?

Thanks again. I appreciate the help!

AceOfJames

Ooops… You can see the problem on the homepage here: https://modussystemsinc.com/

Thanks!

Ok, let’s try this instead:

#menu {
	z-index: 70;
}
.nivo-caption {
	z-index: 60;
}

Add this on the bottom of the CSS style sheet (instead of the previous change)

Pedro,
That nailed it for both issues and worked perfectly!

Thank you for your help!

Your lightbox works great with nextgen gallery and I will be using both from now on!

I was thinking of putting LIKE and TWEET buttons in the descriptions page of the lightbox popup. Do you have any addons like that for it?

Thanks!

James

Unfortunatly I haven’t, but I don’t know if there is something for nextgen gallery…