/    Sign up×
Community /Pin to ProfileBookmark

multiple random image scripts?

It seems that this forum fills up fast, so I am re-posting this in a hopefully clearer form.

I have this script in the head of my HTML

<SCRIPT language=JavaScript>
var theImages = new Array()
theImages[0] = ‘1.gif’
theImages[1] = ‘2.gif’
theImages[2] = ‘3.gif’
var j = 0
var p = theImages.length;
var preBuffer = new Array()
for (i = 0; i < p; i++){
preBuffer[i] = new Image()
preBuffer[i].src = theImages[i]
}
var whichImage = Math.round(Math.random()*(p-1));
function showImage(){
document.write(‘<img src=”‘+theImages[whichImage]+'”>’);
}
</SCRIPT>

And this in the body.

<SCRIPT language=JavaScript>
showImage();
</SCRIPT>

I want to set up a seperate array of images in the head which would populate a seperate area of the page. So I would have multiple random image areas on the page. I don’t know how to distinguish them so that 2 scripts in the head will populate 2 distinct regions on the page with random images. Thanks for patience and help.

to post a comment
JavaScript

3 Comments(s)

Copy linkTweet thisAlerts:
@ExuroJul 18.2003 — I think you're looking for something like this:

<html>

<head>

<SCRIPT language=JavaScript>

var theImages = new Array()

theImages[0] = '1.gif'

theImages[1] = '2.gif'

theImages[2] = '3.gif'

var otherImages = new Array()

otherImages[0] = 'a.gif'

otherImages[1] = 'b.gif'

otherImages[2] = 'c.gif'

var j = 0

var p = theImages.length;

var preBuffer = new Array()

var preBuffer2 = new Array()

for (i = 0; i < p; i++){

preBuffer[i] = new Image()

preBuffer[i].src = theImages[i]

preBuffer2[i] = new Image()

preBuffer2[i].src = otherImages[i]

}

var whichImage = Math.round(Math.random()*(p-1));

var otherImage = Math.round(Math.random()*
(p-1));

function showImage(){

document.write('<img src="'+theImages[whichImage]+'">');

}

function showImage2(){

document.write('<img src="'+otherImages[otherImage]+'">');

}

</SCRIPT>

</head>

<body>



<SCRIPT language=JavaScript>

showImage();

</SCRIPT>

blablabla

<SCRIPT language=JavaScript>

showImage2();

</SCRIPT>

</body>

</html>
Copy linkTweet thisAlerts:
@haasboyauthorJul 18.2003 — i believe that is exactly what I'm after. Thanks a lot!
Copy linkTweet thisAlerts:
@mbockstruckOct 14.2005 — hi. i am a beginner with javascript right now. the above code works great for having random images showing up in 2 spots on a page. how do i change the code if i want to have random images show up in 4 different spots?
×

Success!

Help @haasboy spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.15,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...