问题
I'm working on a "slider". I have a main ul for the main content (e.g., images), as well as a second ul for a thumbnail carousel. Click a thumb (or a prev / next) and I transitions from the current li (read index) to the clicked li using this line:
cacheMainImagesList.siblings('li').eq(currentIndex).fadeOut(opts.imageOutDuration, function(){cacheMainImagesList.eq(displayThisIndex).fadeIn(opts.imageInDuration)});
I'm not acting on the images themselves because I'm shooting for a content slider and not just an image slider. That said, I'm wanting to have a full screen mode. Click a button and the images will fill the screen.
To do the full-screen, I'm adding a class to the outer most wrapper. That class is defined as position: fixed, left:0, top:0. (Note: I don't think this detail matters but what the heck.) The leap to full screen work. It's basically the same uls just wrapped up and CSS'ed slightly different.
However, the line of code above stops working. I'm not getting an error. Specifically, the fadeOut simply stops working. The fadeIn works but for some reason the fadeOut doesn't. In short, the slides stop "sliding", then just pile up. I can go forward in the index, 2, 3, 4, etc. But when I try to go back the currentIndex never does the fadeOut.
Finally, I tried to force it with a hide() but then there's a "flash" of sorts. I also don't want the instant effect of hide. Even if it's a super fast fade, that's still more pleasing.
Anyone have any clues? Obviously, I do not. Thanks.
Perhaps this will help: jsfiddle.net/chiefalchemist/UvpGN/5 Please see comment below about this working. That is, it doesn't reproduce the broke fadeOut.
Let me break it down to its most basic level...The fadeOut and fadeIn are operating on on the same selector / object in the same line of code. It's a matter of two different indexs being changed. Why does fadeout not work but fadeIn does? That's why I'm stumped.
来源:https://stackoverflow.com/questions/11438556/fadeout-on-an-li-stops-working-after-using-addclass-on-div-that-wraps-the-ul