0

I'm experimenting with jquery.scrolling-parallax.js for parallax backgrounds.

The background elements has z-index 333.

On all elements on the site i can make the backround be behind or in front of the elements by using z-indexes below or over this.

But i have problems with my header.

I have a header with fixed position and z-index 232 to have the backgrounds be seen over it.

However, in the header div i have two other divs containing logo and menu. These are position:relative and have z-index:999 since i dont want the background to be on top of them. But this does not work!

If i switch the whole header div to z-index over 333 it works fine, the background appears behind it. But i only want it to go behind those child divs!

Appreciate your help

Andrea Ligios
  • 49,480
  • 26
  • 114
  • 243
jonas
  • 620
  • 1
  • 6
  • 14

1 Answers1

0

If I understand your problem correctly, I think the problem is that your logo and menu should not be using position:relative. Try either using a different type of positioning or placing their div outside of the header div.

By using relative the child is probably taking the header divs z-index.

Michael Cheung
  • 190
  • 1
  • 11
  • Thank you but i'v tried all position values on the childs. Someway it must be possible to give child elements a independent z-index value separate from its parent? – jonas Jul 16 '12 at 09:30