Search code examples
jquerylayermouseclick-eventparallax

jQuery; Parallax page - Get the click event go through DIV layers

DEMO

The idea now is to (instead of transp. .png images) fill the layers with standard HTML elements, like making a nice moving 2d-3d page.

You can guess my first problem. Whatever I tried I cannot make the click event go through the 100x100% div layers to find a clickable (or else?) element that is not the .layer himself.

Maybe making the layers height:0px; position:absolute; and than appending to them relative positioned elements?

Solution

  • Just add a z-index CSS property to the .box elements. The higher the z-index, the higher the elements appear in terms of layers (i.e. elements with a z-index of 999 will be abover those with a z-index of 1):

    .box {
  ...

  z-index: 2;
}

    And a demo.