Random Images On An Html Page

[Leighton]

I've checked a few sites that try to help out with displaying a random image on a page, but so far I've had no luck. All the places I've seen have said put this text here, this text there, replace the text with your filenames and it'll work. But it ain't happening so far. I'd love just a quick and easy instruction and I hope someone here can help me.

Thanks in advance!!

[Euge]

Code: Select all

<script language="JavaScript"><!--

//Javascript Created by Computerhope http://www.computerhope.com

//store the quotations in arrays

images = new Array(4);

images[0] = "<a href = 'http://www.computerhope.com/index.htm'><img src='http://www.computerhope.com/banners/banner.gif' alt='Visit Computer Hope'></a>";

images[1] = "<a href = 'http://www.computerhope.com/history/index.htm'><img src='http://www.computerhope.com/banners/banner2.gif' alt='Computer History'></a>";

images[2] = "<a href = 'http://www.computerhope.com/index.htm'><img src='http://www.computerhope.com/banners/banner3.gif' alt='Visit Computer Hope'></a>";

images[3] = "<a href = 'http://www.computerhope.com/newslet.htm'><img src='http://www.computerhope.com/banners/banner4.gif' alt='Computer Hope Newsletter'></a>";

index = Math.floor(Math.random() * images.length);

document.write(images[index]);

//done

// --></script><br>

I got that to work for me, see if it'll work on your site, and just copy the images[1] bits to have more pictures

[Leighton]

Looks like that works. I'll make some new banners and whack them up soon.

[frantik2k3]

Javascript will get the job done, however, it might fail to work the way you want it to when people view your site using different browsers. You will see a huge difference when viewing your pages in IE and then in FireFox.

Just a heads up on that.

If something breaks in a certain browser, you can usually find a snipbit of code that will correct it. Google is a good source for that stuff.

[Speed Damage]

I think this is pretty much the same as what Euge posted, but I know this worked for me:

Code: Select all

var mess = new Array(
'<img src="banner/banner_01.jpg">',
'<img src="banner/banner_02.jpg">',
'<img src="banner/banner_03.jpg">',
'<img src="banner/banner_04.jpg">',
'<img src="banner/banner_05.jpg">',
'<img src="banner/banner_06.jpg">',
'<img src="banner/banner_07.jpg">',
'<img src="banner/banner_08.jpg">',
'<img src="banner/banner_09.jpg">',
'<img src="banner/banner_10.jpg">');
var max = mess.length;
var num = Math.floor((Math.random() * max));
document.writeln(mess[num]);

(change the file names to you images, thats just what I was using)

save that as a javascript (random.js for example) then just insert that where you want the random image with "<script type="text/javascript" src="random.js">"

[slayerdiabolus]

I was asking Spawn the very same question last week. thanks for this!!