Wilto / Dynamic-Carousel

A carousel plugin built for responsive layouts. There are many like it, but this one is mine.
matmarquis.com/carousel/
472 stars 112 forks source link

z-index weirdness with layered slideshow controls #48

Closed jaredfager closed 12 years ago

jaredfager commented 12 years ago

This may have a lot more to do with the fact that I threw this page together in a few hours, but I sort of think this is a bug. Check out http://1023columbus.com (a totally incomplete teaser site for the coworking space my girlfriend and I are opening) in webkit, and resize the window until you can see just a hair of the image in the second slide. If you then click on either of the slideshow controls, the slider jumps up over them in the z-index. I've tried overriding it with kinda gross css, but to no avail.

I'm thinking, given the way this has to be triggered, that it has something to do with the js, but then, I don't know enough about js to be sure.

Wilto commented 12 years ago

Hey man. Just looked into this on your site—adding z-index: 2; to the arrow links themselves seemed to solve the problem. I think the issue is that the JS is applying position: relative; to the slides, which is adding them to the z-index stacking context with the absolute positioned controls. Increasing the z-index of the controls ensures that they’ll stay above the slides, which are at the default z-index.

jaredfager commented 12 years ago

Hang on, I need to clean the egg off my face.

Something about editing local and previewing live…