Why do I need this Callback function in order to work properly?
I'm working through a jQuery image slider tutorial and I lost them at the point where they put a Callback function on the .animate() option - the callback is the removeClass. Why do I need it? If I take the callback function out, the slider stops working.
function slideSwitch() {
var $active = $('#slideshow IMG.active');
var $next = $active.next();
$active.addClass('last-active');
$next.css({opacity: 0.0开发者_如何学Go})
.addClass('active')
.animate({opacity: 1.0}, 1000, function() {
$active.removeClass('active last-active');
});
}
$(function() { setInterval( "slideSwitch()", 5000 ); });
This is how the slider works:
Basically, there are 3 images positioned (absolutely) on top of each other. The first image is given the class "active" with a high z-index, so it shows up on top.
After 5 seconds, the code then finds the next image and makes that the class "active", and makes the original one ".last-active", which has a slightly lower z-index. The new ".active" is given an opacity of 0.0 but slowly animated to 1.0 in a second.
It's quite a simple slider, actually. I understand everything else apart from why I need that callback function that removes the classes "last-active" and "active" after the animate is complete. Doesn't ".active" need to stay as ".active" to be on top?
It might help you to help me if you saw the tutorial yourself. It can be found at: http://jonraasch.com/blog/a-simple-jquery-slideshow
Thanks in advance!
That callback is removing the classes from the previously active slide ($active
).
$next
becomes the new active slide (and gets the class from the statement just prior to animate
).
If the code didn't remove the class from $active
there would be two active slides after all is said and done.
The callback is called after the animation (changing opacity value) is done.
So if you remove the callback and append it directly after the animate, it will remove the classes before the animation is done.
Else if you remove the callback completely, you lost the way to remove the classes (of course XD")
精彩评论