Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jun 2012
    Posts
    7
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Store image paths in an array variable and then display them

    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>
    Last edited by BrightEdge; 06-19-2012 at 03:39 PM.

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,396
    Thanks
    12
    Thanked 569 Times in 562 Posts
    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)

    Code:
    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);
       }
    }

  • #3
    New to the CF scene
    Join Date
    Jun 2012
    Posts
    7
    Thanks
    3
    Thanked 0 Times in 0 Posts
    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>
    Last edited by BrightEdge; 06-20-2012 at 07:05 AM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •