0

好的,我有这样的代码:

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);

它完美地工作。

好的,找到问题了。当图像处于绝对位置时,它会以某种方式工作

4

0 回答 0