User avatar
libralion
Posts: 55
Joined: Sat Sep 12, 2009 8:06 am

See menu through photo

Hi everybody,
I have a weird problem.
When I click on a large photo I see the menu through it.
See on this page the second photo: http://www.patriciakaas.nl/english/albu ... azines.htm
What should I do?

Johanna
MisterNeutron
Posts: 440
Joined: Sun Aug 18, 2013 11:20 am

Re: See menu through photo

These are all z-index problems, so you need to do a little reading about z-index. In this case, change the z-index for .navbar in custom.css:

Code: Select all

.nav {
     z-index: 900;
}
All of the Highslide JS expander stuff has a z-index of 1000 or greater, so that should keep you out of trouble.
User avatar
libralion
Posts: 55
Joined: Sat Sep 12, 2009 8:06 am

Re: See menu through photo

Yes I thought it had tot do with that.
But what is the right z index?
A couple of posts ago I already described a problem with the menu.
The menu fell behind the image and I couldnt access certain menu items.
You suggested then to put the z index at 2000.
So changing it to 900 will bring back that same problem.

Johanna
MisterNeutron
Posts: 440
Joined: Sun Aug 18, 2013 11:20 am

Re: See menu through photo

There is no "right" value for z-index. It's all relative. In short, if there are two objects that want to be in the same position, the object with the higher z-index appears on top of the other.

You can't have it both ways - either the menu appears on top of the expanded images, or it doesn't. You'll probably have to do some in-line styling so that it can behave one way on one page, and the other way on another page. On a page where you're using an in-page gallery, you'll want the menu to have a higher z-index than the Highslide default (1000). On a page like this one, it needs to have a lower z-index than the Highslide stuff.
User avatar
libralion
Posts: 55
Joined: Sat Sep 12, 2009 8:06 am

Re: See menu through photo

Ok I understand now. Thanks a lot!

Johanna

Return to “Highslide JS Usage”