Images array - need a loop

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • toxicpaint
    New Member
    • Sep 2006
    • 58

    Images array - need a loop

    Hi, can anyone give me a hand.

    I'm currently displaying 4 random images at the top of a page. I did this using an array of 35 pictures and then writing them to page. The problem I have is that in theory you could get the same image 4 times. I quite often get 2 of the same picture come up. What's the easiest way of saying "once an image is assigned to a variable, take it out of the array"?

    Here's my code so far..

    images = new Array(34);

    images[0] = "<img src='images/1.jpg' />";
    images[1] = "<img src='images/2.jpg' />";
    images[2] = "<img src='images/3.jpg' />";
    images[3] = "<img src='images/4.jpg' />";
    images[4] = "<img src='images/5.jpg' />";
    images[5] = "<img src='images/6.jpg' />";
    images[6] = "<img src='images/7.jpg' />";
    images[7] = "<img src='images/8.jpg' />";
    images[8] = "<img src='images/9.jpg' />";
    images[9] = "<img src='images/10.jpg' />";
    images[10] = "<img src='images/11.jpg' />";
    images[11] = "<img src='images/12.jpg' />";
    images[12] = "<img src='images/13.jpg' />";
    images[13] = "<img src='images/14.jpg' />";
    images[14] = "<img src='images/15.jpg' />";
    images[15] = "<img src='images/16.jpg' />";
    images[16] = "<img src='images/17.jpg' />";
    images[17] = "<img src='images/18.jpg' />";
    images[18] = "<img src='images/19.jpg' />";
    images[19] = "<img src='images/20.jpg' />";
    images[20] = "<img src='images/21.jpg' />";
    images[21] = "<img src='images/22.jpg' />";
    images[22] = "<img src='images/23.jpg' />";
    images[23] = "<img src='images/24.jpg' />";
    images[24] = "<img src='images/25.jpg' />";
    images[25] = "<img src='images/26.jpg' />";
    images[26] = "<img src='images/27.jpg' />";
    images[27] = "<img src='images/28.jpg' />";
    images[28] = "<img src='images/29.jpg' />";
    images[29] = "<img src='images/30.jpg' />";
    images[30] = "<img src='images/31.jpg' />";
    images[31] = "<img src='images/32.jpg' />";
    images[32] = "<img src='images/33.jpg' />";
    images[33] = "<img src='images/34.jpg' />";
    images[34] = "<img src='images/35.jpg' />";

    index = Math.floor(Math .random() * images.length);
    index2 = Math.floor(Math .random() * images.length);
    index3 = Math.floor(Math .random() * images.length);
    index4 = Math.floor(Math .random() * images.length);
  • epots9
    Recognized Expert Top Contributor
    • May 2007
    • 1352

    #2
    just perform if statements, if the first equals the second, redo the second, and so on.

    Comment

    • gits
      Recognized Expert Moderator Expert
      • May 2007
      • 5388

      #3
      hi ...

      there are several ways for you to avoid the double images ... you may use 4 arrays instead of 1 ... adapt the random number to not to be equal to each other ... and you may adapt the array of course ... have a look at array methods like shift(), unshift(), splice() and pop() ... with that you may manipulate the array to your needs ... but be aware ... some manipulate the original array, others give you back the elements ...

      kind regards ...

      Comment

      • toxicpaint
        New Member
        • Sep 2006
        • 58

        #4
        Thanks a lot for your replies.

        I did try and implement a set of if statements and failed miserably! I'll do the set of 4 arrays. That sounded easy enough. Cheers!

        Comment

        • gits
          Recognized Expert Moderator Expert
          • May 2007
          • 5388

          #5
          hi ;) ... have a look at the following example how you may get 4 distinct random-numbers and refer to them:

          [HTML]
          <script>
          function generate_four_r andom_numbers(n umber, max) {
          var indices = {};

          for (var i = 0; i < number; i++) {
          var index = Math.floor(Math .random() * max);

          while (typeof indices[index] != 'undefined') {
          index = Math.floor(Math .random() * max);
          }

          indices[index] = 1;
          }

          return indices;
          }
          </script>


          <body onload="
          var indices = generate_four_r andom_numbers(4 , 34);
          var j = 0;

          for (var i in indices) {
          alert(j + '/' + i);
          j++;
          };
          ">
          </body>
          [/HTML]

          kind regards ...

          Comment

          Working...