Thursday, 12 September 2013

jquery next () and setInterval ()

jquery next () and setInterval ()

<div class='parent'>
<div class='item'>1</div>
<div class='item'>2</div>
<div class='item'>3</div>
<div class='item'>4</div>
</div>
$('.parent .item').each (function () {
var current = $(this);
setInterval (function () {
$(current).fadeOut (function () {
$(this).next ().fadeIn ();
});
}, 2000); //rotate every 2 seconds
});
I want to do the following: Show each "item" for 2 seconds and after that
fadeOut and fadeIn the next item. When there are no more items then
fadeOut and start from the beginning. The code seems like it would work
but it is having timing issues and doesn't move automatically through all
items. Any help would be appreciated.

No comments:

Post a Comment