CSS-Tricks/AnythingSlider

Images do not cross fade

bghouse opened this issue · 4 comments

bghouse commented

I've verified latest code version, default css. Images are not cross fading, and there is a .fade in the css file. Always "pops"

What did I miss here?

Mottie commented

Hi bghouse!

Maybe check that no other css is interfering with the opacity and z-index of the panels (.panel). If the css hasn't been reset, try doing that as well.

If you still can't get it working properly, send me a link to the site here or via email (gmail, user name wowmotty).

bghouse commented

Hi Mottie,

I sent you an email, and I still have problem. No .panel css to interfere. My dev site is at fsb.xigko.com. I've tried every theme css, all the same result. Currently using mini-light.

f3cp commented

I am noticing the same issue. It looks like the z-index of the incoming slide does not get changed from -1 to 0 until after the opacity has reached 1, rather than before.

Mottie commented

Oh sorry, we resolved this via email. The solution was to modify this css:

.anythingSlider .fade .activePage { z-index: 1; }
.anythingSlider .fade .panel { z-index: 0; }

By default the panels were getting a z-index of -1, so they actually ended up behind the background.