Using TweenMax to fade in div with background pattern and z-index not working
- by shibbydoo
I'm trying to do this really simple fade using TweenMax for this div I have. Here's the css for the div
.aboutBg {
background:url(../images/pattern.jpg);
top:0;
right:0;
left:0;
bottom:0,
position:fixed;
border:10px solid red;
z-index:10;
}
TweenMax.to('.aboutPage', 0.5, {autoAlpha:1});
What's happening is the border would fade in nicely but the patterned bg is not, it just pops up at the end of the tween. If I remove the z-index everything works, but I have to have set the z-index so it's on top of my other content. Also I'm not tweening the z-index, it's set before the tween, so I'm not sure why it's not fading correctly. Anyone has any idea? Thanks.