Random Images on Refresh

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Thread Solved

Join Date: Apr 2005
Posts: 2
Reputation: jeeva86 is an unknown quantity at this point 
Solved Threads: 0
jeeva86 jeeva86 is offline Offline
Newbie Poster

Random Images on Refresh

 
-1
  #1
Apr 26th, 2005
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..
Reply With Quote Quick reply to this message  
Join Date: Dec 2004
Posts: 1,655
Reputation: tgreer is an unknown quantity at this point 
Solved Threads: 35
Team Colleague
tgreer tgreer is offline Offline
Made Her Cry

Re: Random Images on Refresh

 
0
  #2
Apr 26th, 2005
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.
Reply With Quote Quick reply to this message  
Join Date: Jan 2005
Posts: 18
Reputation: demo is an unknown quantity at this point 
Solved Threads: 2
demo demo is offline Offline
Newbie Poster

Re: Random Images on Refresh

 
0
  #3
Apr 26th, 2005
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
Reply With Quote Quick reply to this message  
Join Date: Jan 2005
Posts: 10
Reputation: raywood5 is an unknown quantity at this point 
Solved Threads: 1
raywood5 raywood5 is offline Offline
Newbie Poster

Re: Random Images on Refresh

 
0
  #4
May 5th, 2005
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.
Reply With Quote Quick reply to this message  
Join Date: May 2005
Posts: 182
Reputation: alpha_foobar is an unknown quantity at this point 
Solved Threads: 3
alpha_foobar's Avatar
alpha_foobar alpha_foobar is offline Offline
Junior Poster

Re: Random Images on Refresh

 
0
  #5
May 5th, 2005
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.
Reply With Quote Quick reply to this message  
Join Date: Apr 2005
Posts: 2
Reputation: jeeva86 is an unknown quantity at this point 
Solved Threads: 0
jeeva86 jeeva86 is offline Offline
Newbie Poster

Re: Random Images on Refresh

 
0
  #6
May 19th, 2005
thanks raywood for the code although i no longer needed..but it was quite learning
Reply With Quote Quick reply to this message  
Join Date: Jun 2005
Posts: 1
Reputation: Matt02 is an unknown quantity at this point 
Solved Threads: 1
Matt02 Matt02 is offline Offline
Newbie Poster

Re: Random Images on Refresh

 
0
  #7
Jun 13th, 2005
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
Reply With Quote Quick reply to this message  
Join Date: Dec 2004
Posts: 1,655
Reputation: tgreer is an unknown quantity at this point 
Solved Threads: 35
Team Colleague
tgreer tgreer is offline Offline
Made Her Cry

Re: Random Images on Refresh

 
0
  #8
Jun 13th, 2005
That's only the case with locally loaded HTML files. Once you publish to a website, your users will not get that message.
Reply With Quote Quick reply to this message  
Join Date: Aug 2006
Posts: 1
Reputation: ANH! is an unknown quantity at this point 
Solved Threads: 1
ANH! ANH! is offline Offline
Newbie Poster

Re: Random Images on Refresh

 
0
  #9
Aug 7th, 2006
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.
Reply With Quote Quick reply to this message  
Join Date: Aug 2006
Posts: 2
Reputation: drogue is an unknown quantity at this point 
Solved Threads: 1
drogue's Avatar
drogue drogue is offline Offline
Newbie Poster

Re: Random Images on Refresh

 
0
  #10
Aug 14th, 2006
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?
Reply With Quote Quick reply to this message  
Reply

This thread has been marked solved.
Perhaps start a new thread instead?
Message:



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum
Thread Tools Search this Thread



About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC