Store image paths in an array variable and then display them

BrightEdge

06-19-2012, 03:25 PM

Hello,

I am trying to store several image paths in a variable and subsequently display the images. Here is my code that is not working. Would appreciate any help

<html>

<p id="storedImages">

<img src="http://t0.gstatic.com/images?q=tbn:ANd9GcSX8Pihxki_oP9oLRtRc0qZyiXfy03eBjXAGa3ITP-CZ5t1KTiF21vVfHqV" >

<img src = "http://t3.gstatic.com/images?q=tbn:ANd9GcTj1nTNKPcDHyGSWHzymmihq-gyforOUuYxis5Lvj35G6cqaDJlufad5A">

</p>

<script type="text/javascript" >

var imageSources = " ";

for(var i=0; i<2; i++ ){

imageSources += document.images[i].src;

}

document.write('<img src = imageSources >')

</script>

</html>

devnull69

06-19-2012, 05:52 PM

Why would you want to store the information in an array? You already have it in the DOM ... you just need to loop the images and toggle the display state for the images. This example will change the image every 1 sec ( = 1000 msec)

var theImages = document.images;
for(i=0; i<theImages.length; i++) {
// hide all the images
theImages[i].style.display = 'none';
}

var currentImage=0;
theImages[currentImage].style.display = '';
// after 1 sec show next image
window.setTimeout(showImage, 1000);

function showImage() {
currentImage++;
if(currentImage<theImages.length) {
theImages[currentImage].style.display = '';
theImages[currentImage-1].style.display = 'none';
window.setTimeout(showImage, 1000);
}
}

BrightEdge

06-19-2012, 06:11 PM

Hello devnull69,

Thanks for the reply. I would like to have them stored in a variable (not as an array) and then just display them in a static manner.

Here is just a basic form that I'm stuck with

<html>

<script type="text/javascript" >

var imageSources = "http://t0.gstatic.com/images?q=tbn:ANd9GcSX8Pihxki_oP9oLRtRc0qZyiXfy03eBjXAGa3ITP-CZ5t1KTiF21vVfHqV";

document.write('<img src = imageSources >') // could I have a variable as a src if possible?

</script>

</html>