jQuery code strange acting
<p>Ok i have a code like this : </p>

<pre><code>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);
&lt;ul class="recipeImages"&gt;  
    &lt;li style='display:none;'&gt;&lt;img src='images/food.jpg' /&gt;&lt;/li&gt;
    &lt;li style='display:none;'&gt;&lt;img src='images/food_cukinija.jpg' /&gt;&lt;/li&gt;
    &lt;li style='display:none;'&gt;&lt;img src='images/food_hamburger.jpg' /&gt;&lt;/li&gt;
    &lt;li style='display:none;'&gt;&lt;img src='images/food_sushi.jpg' /&gt;&lt;/li&gt;  
&lt;/ul&gt;
</code></pre>

<p>what is wrong here? it acts strange when it goes to the last LI element and there is no next element. It just stops, then first one appears and again last and etc... but until he comes to  this point  </p>

<pre><code>if($active.next().length == 0)    
    $next = $('li:first', this);
</code></pre>

<p>it works perfectly.</p>

<p>Ok, found the problem. It works somehow buggy when the image is in absolute position</p>
