JQuery WOW slide / animate effect: Z-Index issues

1.3k Views Asked by At

I'm using the wow.js framework based on JQuery Animate on this site I just completed: (http://adrenalinetv.com/). Problem is I noticed on the animations I have that slide up, the animated element slides above the div underneath the element I'm sliding. So you see the element in the next div or div's. So I thought, OK...I'll just make the z-index of that div higher and my problem will be gone. However, no matter what z-index I set that div, the animated element always appears on top of it as it slides into place. I'm not sure if that's because of the wow javascript, the animate.css or script or what. Anyone familiar with this framework know how to correct this? Or is it correctable?

1

There are 1 best solutions below

1
On BEST ANSWER

The element that you are giving a z-index cannot have a position static. So give it a position relative and the z-index fix should work.

From CSS-tricks (http://css-tricks.com/almanac/properties/z/z-index/)

As in, which one appears as if it is physically closer to you. z-index only effects elements that have a position value other than static (the default).