I'm trying to do a slideshow gallery in Javascript, but it doesn't work... When I run this code, the src goes to veyron.jpg instantly, skipping the lamborghini.jpg.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<img id="img" src="ferrari.jpg" />
<script>
img = document.getElementById("img");
images = new Array("ferrari.jpg","lamborghini.jpg","veyron.jpg");
end = images.length -1;
window.onload = setInterval(slide,1000);
function slide(){
for(i=0;i<=end;i++){
img.src = images[i];
}
}
</script>
</body>
</html>
why loop is exist here, you are casting all the images in all.
Do it with increment variable with start
<script>
var img = document.getElementById("img");
var images = new Array("ferrari.jpg","lamborghini.jpg","veyron.jpg");
var end = images.length -1;
var start = 0;
window.onload = setInterval(slide,1000);
function slide(){
img.src = images[start%end];
start++;
}
</script>
example fiddle
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With