jQuery的变化图像

我有这样的脚本：jQuery的变化图像

<script> 
var images = [ 
    "webit.png", 
    "analog.png", 
    "projectica.png" 
]; 

currentImage = 0; 

function ChangeImage() 
{ 
    currentImage++; 

    if (currentImage > images.length - 1) 
     currentImage = 0; 
    $("#screenBackImage").css("background-image", "url(images/works/" + images[currentImage] + ")"); 

    $("#screenImage").fadeOut(500, function() { 
     $("#screenImage").attr("src", "images/works/" + images[currentImage]); 
     $("#screenImage").fadeIn(500); 
    }); 
    setTimeout(function() { 
     ChangeImage(); 
    }, 5000); 
} 

ChangeImage(); 
</script>

当在第一时间的图像变化，这是跳过图像阵列中的第二图像，以“projectica.png”，然后到在阵列中的第一个图像，然后它的工作良好（第一，第二，第三，再次第一..），

这是为什么发生？

来源

2013-04-01 nirbe

你说的意思是什么“那么它的工作好”？并注意你从数组中的第二个图像开始（数字从0开始），随着您在开始时增加 – pfried

您使用数组的第二个索引通过增加索引变量通过currentImage++;初始化currentImage到-1会做的伎俩为您第一时间的问题，你会被currentImage++;

获得零指数（第一要素）更改

currentImage = 0;

为

currentImage = -1;

您的代码将

var images = [ 
    "webit.png", 
    "analog.png", 
    "projectica.png" 
]; 

currentImage = -1; 

function ChangeImage() 
{ 
    currentImage++; 

    if (currentImage > images.length - 1) 
     currentImage = 0; 
    $("#screenBackImage").css("background-image", "url(images/works/" + images[currentImage] + ")"); 

    $("#screenImage").fadeOut(500, function() { 
     $("#screenImage").attr("src", "images/works/" + images[currentImage]); 
     $("#screenImage").fadeIn(500); 
    }); 
    setTimeout(function() { 
     ChangeImage(); 
    }, 5000); 
} 

ChangeImage();

来源

2013-04-01 07:29:21 Adil

我认为你应该这样做：

if (currentImage > images.length - 1) currentImage = 0; 
$("#screenBackImage").css("background-image", "url(images/works/" + images[currentImage] + ")"); 

$("#screenImage").fadeOut(500, function() { 
    $("#screenImage").attr("src", "images/works/" + images[currentImage]); 
    $("#screenImage").fadeIn(500); 
}); 

// Increment the currentImage variable here, not in the begining... 
currentImage++;

DEMO HERE

来源

2013-04-01 07:30:30

jQuery的变化图像

回答

相关问题