943,809 Members | Top Members by Rank

Ad:
You are currently viewing page 1 of this multi-page discussion thread
Apr 26th, 2005
-1

Random Images on Refresh

Expand Post »
Hi, I wanted to know how would you be able to change an image on a website to another one when refresh is hit on the tool bar in IE

or how would i get it to open up a different html file when i hit refresh

and i'm not talking abt any automatic delay stuff..
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
jeeva86 is offline Offline
2 posts
since Apr 2005
Apr 26th, 2005
0

Re: Random Images on Refresh

I think you'll need some server side code. Something that looks at a timestamp, a rolling counter, a database value, something... and automatically authors the appropriate image tag. Right now, I can't think of how you'd accomplish this with client scripting.
Team Colleague
Reputation Points: 227
Solved Threads: 37
Made Her Cry
tgreer is offline Offline
1,697 posts
since Dec 2004
Apr 26th, 2005
0

Re: Random Images on Refresh

You can use JS and a cookie...

Create a directory with images named ##.jpg

Then when the page loads read or set the cookie with that image id (##) the next time the page loads read the cookie and get the id ( ##) and then switch the image 'image_swap' with the next numbered image or reset the number id (##) when you reach the last valid id (##) for images you have!

Simple Stuff

demo
Reputation Points: 10
Solved Threads: 2
Newbie Poster
demo is offline Offline
18 posts
since Jan 2005
May 5th, 2005
-1

Re: Random Images on Refresh

This script will load random images and they will change when you refresh. I hope this is what you are looking for:

Put in the head:

[html]<SCRIPT LANGUAGE="JavaScript">
var theImages = new Array()

//Random-loading images
theImages[0] = 'images/home_rotate1.gif' // replace with names of images
theImages[1] = 'images/home_rotate2.gif' // replace with names of images
theImages[2] = 'images/home_rotate3.gif' // replace with names of images
theImages[3] = 'images/home_rotate4.gif' // replace with names of images

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(){
if(whichImage==0){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}
else if(whichImage==1){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}
else if(whichImage==2){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}
else if(whichImage==3){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}
else if(whichImage==4){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}

}

</script>

//Then put this where you want the images to appear:

<script>showImage();</script>[/html]
Last edited by cscgal; Aug 15th, 2006 at 10:31 am.
Reputation Points: 10
Solved Threads: 1
Newbie Poster
raywood5 is offline Offline
10 posts
since Jan 2005
May 5th, 2005
0

Re: Random Images on Refresh

Did you want a random page on refresh?

Server side would be better for this. But if you wanted to do it client side, then just have an array of URLs and use the document.location.href attribute (randomly selecting a loaction).

Of course you couldn't have the random href set onload, otherwise you would trap your client in an infinite loop. Assign it on unload.
Reputation Points: 20
Solved Threads: 5
Junior Poster
alpha_foobar is offline Offline
182 posts
since May 2005
May 19th, 2005
0

Re: Random Images on Refresh

thanks raywood for the code although i no longer needed..but it was quite learning
Reputation Points: 10
Solved Threads: 0
Newbie Poster
jeeva86 is offline Offline
2 posts
since Apr 2005
Jun 13th, 2005
0

Re: Random Images on Refresh

Hi, I am trying to use the code example you provided for using javascript to display a random image. I implemented the code but my problem now is that IE with service pack 2 seems to block that part of the page as "active content" and you have to click the annoying notice bar to allow it manually. My question is there any way to avoid that using the example you provided? I know some sites like James Madison University (www.jmu.edu) have randomly selected images on their homepage and it doesn't come up blocked there so I'm trying to figure out why.

Thanks
Reputation Points: 10
Solved Threads: 1
Newbie Poster
Matt02 is offline Offline
1 posts
since Jun 2005
Jun 13th, 2005
0

Re: Random Images on Refresh

That's only the case with locally loaded HTML files. Once you publish to a website, your users will not get that message.
Team Colleague
Reputation Points: 227
Solved Threads: 37
Made Her Cry
tgreer is offline Offline
1,697 posts
since Dec 2004
Aug 7th, 2006
1

Re: Random Images on Refresh

Quote originally posted by raywood5 ...
This script will load random images and they will change when you refresh. I hope this is what you are looking for:

Put in the head:

<SCRIPT LANGUAGE="JavaScript">
var theImages = new Array()

//Random-loading images
theImages[0] = 'images/home_rotate1.gif' // replace with names of images
theImages[1] = 'images/home_rotate2.gif' // replace with names of images
theImages[2] = 'images/home_rotate3.gif' // replace with names of images
theImages[3] = 'images/home_rotate4.gif' // replace with names of images

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(){
if(whichImage==0){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}
else if(whichImage==1){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}
else if(whichImage==2){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}
else if(whichImage==3){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}
else if(whichImage==4){
document.write('<a href ="link.html"><img src="'+theImages[whichImage]+'" border=0 width=452 height=181></a>');
}

}

</script>

//Then put this where you want the images to appear:

<script>showImage();</script>
Wow thanks, a code that actually works... but I still have a problem/query...

Is there any way that in 4 refreshes every image is shown once?

Dont think I can explain much more...

Thanks for any help in advance.
Reputation Points: 10
Solved Threads: 1
Newbie Poster
ANH! is offline Offline
1 posts
since Aug 2006
Aug 14th, 2006
0

Re: Random Images on Refresh

hey all, I am trying to make use of this script as well - I understand where to paste the script in the head, however - where do I paste the: <script>showImage();</script>

I tried pasting in the cell where the image appears - do I not have an img tag there? It creates a large gap in my table?

I am new!

thanks - also -

The only part of the script I edit is the image ???

//Random-loading images
theImages[0] = 'images/home_rotate1.gif' // replace with names of images
theImages[1] = 'images/home_rotate2.gif' // replace with names of images
theImages[2] = 'images/home_rotate3.gif' // replace with names of images
theImages[3] = 'images/home_rotate4.gif' // replace with names of images

correct?
Reputation Points: 10
Solved Threads: 1
Newbie Poster
drogue is offline Offline
2 posts
since Aug 2006

This thread is solved

Either the thread starter or a moderator has marked this thread as solved. You can most likely trust the responses and answers given. There is most likely no reason for any further responses to be posted here. If you have a related question, please start a new thread in this forum instead.

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: Validating a file input inside an iframe
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: Jquery Ajax GET Problem!!!!!





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC