jquery - jQuery コードの奇妙な動作

Question

わかりました私はこのようなコードを持っています:

function swapImages() {  
    $('.recipeImages').each(function() {  
        if($('li.active', this).length == 0) {  
        $('li:first', this).fadeIn(1000, function() { 
                $(this).addClass('active'); 
            });  
        return;  
        }  
        var $active = $('li.active', this);  
        var $next;  

        if($active.next().length == 0)  
            $next = $('li:first', this);  
        else  
            $next = $('li.active', this).next();  

        $active.fadeOut(1000, function() {  
            $active.removeClass('active');  
            $next.fadeIn(1000, function() {  
                $(this).addClass('active');  
            });  
        });  
    });  
}  
swapImages();  
setInterval('swapImages()', 5000);
<ul class="recipeImages">  
    <li style='display:none;'><img src='images/food.jpg' /></li>
    <li style='display:none;'><img src='images/food_cukinija.jpg' /></li>
    <li style='display:none;'><img src='images/food_hamburger.jpg' /></li>
    <li style='display:none;'><img src='images/food_sushi.jpg' /></li>  
</ul>

ここで何が問題なのですか？最後の LI 要素に移動し、次の要素がない場合、奇妙な動作をします。それはただ止まり、最初のものが現れ、再び最後に、など...しかし、彼がこの時点に来るまで

if($active.next().length == 0)    
    $next = $('li:first', this);

それは完全に機能します。

わかりました、問題が見つかりました。画像が絶対位置にあると、なんとなくバグがあります