7 replies to this topic

[chewx]

Ok got a random image display and have tried to make it so once the image is displayed it is taken out of the array so it can not be viewed again untill there are no more elements in the array, problem is, it doesn't work.

Have been told about shuffle, but not very keen on that.

Can someone shed some light.

4 images, with accompaning links to be displayed 4 times, all unique.

Code:

<script language="JavaScript">
function random_imglink(){
  var myimages=new Array()
	myimages[0]="http://ads.factorymedia.com/www/images/fbm_oct10_300x80.gif"
	myimages[1]="http://ads.factorymedia.com/www/images/rbbyd_web_banner_300x80_animated.gif"
	myimages[2]="http://ads.factorymedia.com/www/images/2010_vex_300x80.jpg"
	myimages[3]="http://ads.factorymedia.com/www/images/image_3.gif"
  var imagelinks=new Array()
	imagelinks[0]="http://www.4downdistribution.com/"
	imagelinks[1]="http://www.redbull.co.uk/cs/Satellite/en_UK/Event/Red-Bull-Backyard-Digger-021242831811513"
	imagelinks[2]="http://verdebmx.com/"
 	imagelinks[3]="http://www.zealbmx.com/"
  var count;
  for(count=0; count<myimages.length; count++) {
  if (myimages.length>0) {
     var ry=Math.floor(Math.random()*myimages.length)
     document.write('<div class="feed2"><a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" height=64px width=240px border=0></a></div>')
	 if (ry>0 && ry<myimages.length-1) {
	    myimages=concat(myimages. (0,ry-1),myimages.slice(ry+1,myimages.length-1));
	    imagelinks=concat(imagelinks.slice(0,ry-1),imagelinks.slice(ry+1,imagelinks.length-1));
	 }
	 if (ry==0) {
	    myimages=myimages.slice(1,myimages.length-1);
	    imagelinks=imagelinks.slice(1,imagelinks.length-1);
	 }
	 if (ry==myimages.length-1) {
	    myimages=myimages.slice(0,ry-1);
	    imagelinks=imagelinks.slice(0,ry-1);
	 }
  }
  }
}
</script>

<script language="JavaScript">
random_imglink();
</script>

Thanks

[JoeyMagz]

did you try changing the if statement to:

if (myimages[count].length>0)

then just displaying that image and link, and finally delete the image and link?

You would have to take out the ry and document write stuff and replace it with just displaying that image and link and then deleting it from the array.

[rc69]

function random_imglink(){
  var myimages=new Array();
        myimages[0]="http://ads.factorymedia.com/www/images/fbm_oct10_300x80.gif";
        myimages[1]="http://ads.factorymedia.com/www/images/rbbyd_web_banner_300x80_animated.gif";
        myimages[2]="http://ads.factorymedia.com/www/images/2010_vex_300x80.jpg";
        myimages[3]="http://ads.factorymedia.com/www/images/image_3.gif";
  var imagelinks=new Array();
        imagelinks[0]="http://www.4downdistribution.com/";
        imagelinks[1]="http://www.redbull.co.uk/cs/Satellite/en_UK/Event/Red-Bull-Backyard-Digger-021242831811513";
        imagelinks[2]="http://verdebmx.com/";
        imagelinks[3]="http://www.zealbmx.com/";

  var indexes = [0, 1, 2, 3];
  index.sort(function (){ reutrn 0.5 - Math.random(); });

  for(var count=0; count < index.length; count++) {
    var ry = indexes[count];
    document.write('<div class="feed2"><a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" height=64px width=240px border=0></a></div>');
  }
}

That should do the trick for you. If you want something more uniformly random, you should research how Microsoft's Browser Ballot screen randomizes the results it displays.

[chewx]

That code above didn't work at all.

Nothing shows :S

[chewx]

did you try changing the if statement to:

if (myimages[count].length>0)

then just displaying that image and link, and finally delete the image and link?

You would have to take out the ry and document write stuff and replace it with just displaying that image and link and then deleting it from the array.

I don't really get what you mean.

[JoeyMagz]

rc69's code displays all 4 images at the same time for me =/. To get his to work you had to fix the misspelled "return" and change index to indexes. What I was talking about was change the if statement to what I had and in the for loop you have to remove the current link and image from the array after you display it. Once all 4 images have been removed from the array, you will need to re-add them with another function or something. This is the only guaranteed way to get a different image each time.

[rc69]

Woops, ya, forgot my usual disclaimer: I make typos. I didn't test the code, but it should be conceptually correct after you account for what Joey pointed out. I'm sure there are also more ways to get the images to display randomly, without duplicates, in JavaScript but the two ideas presented so far are the simplest.

Also, as Joey pointed out, both the code you provided and the code i provided will display 4 images at once. Is that expected behavior?

Edited by rc69, 05 December 2010 - 10:32 PM.

[chewx]

Found the index's mistake but didn't spot the return, school boy error.

Cheers, it works fine.

Edited by chewx, 06 December 2010 - 11:32 AM.