Tom's Guide | Tom's Hardware | Tom's Games
![]() |
![]() |
![]() |
I use a script that works well in cycling through a list of images - problem is, it cycles the images at random - is there any easy way to cycle the images sequentially?
<script>
var randombgs=[
"x.jpg",
"y.jpg" ]document.write('<body style="background: url('+randombgs[Math.floor(Math.random()*randombgs.length)]+');background-repeat: no-repeat; background-position: center; background-color:#000000;" >')
</script>My java background is fairly sparse. I did try to research this a bit myself already but the code examples vary so greatly, it is difficult to pinpoint what can be swapped. I'm guessing the math.random is a factor. any help would be appreciated.

Hi,
Not sure what you are trying to do exactly.
Try changing the following to a number >=0 and < randombgs.length:
Math.floor(Math.random()*randombgs.length)
=> e.g.
document.write('<body style="background: url('+randombgs[0]+');background-repeat: no-repeat; background-position: center; background-color:#000000;" >')
(Note: it's javascript not java, two very different things) .
As far as I can tell, it just pulls a random background image up each time it loads the page, so, what is it exactly you are trying to achieve?
hth in the meantime,
Elinor
Elinor Hurst
http://elinorhurst.blogspot.com

Thanks for the help Elinor. I use it to cycle through a series of backgrounds in a page - recently my needs have changed and I want the images to refresh in sequence rather than at random.
Thank you very much for the reply, the change you suggested did take it to the first image in the lineup, however it did not bring any other images up upon refresh other than the first image in the list.

Hi again,
Well, if you need to make sure the user goes through the whole sequence in the right order when they visit the page (one image per page load), you will have to use a cookie. Note that cookies are not always activated which means this may or may not work depending on browser settings.
<script language="javascript">
var randombgs=["x.jpg","y.jpg","z.jpg"];
var COOKIE_NAME="bgIndex";function readIndexFromCookie()
{
var vals=document.cookie.split(';');
var res=-1;
var ci=0;
while (ci<vals.length && res<0)
{
var cval=vals[ci];
while (cval.substring(0,1)==" ")
cval=cval.substring(1);
if (cval.indexOf(COOKIE_NAME)==0)
res=parseInt(cval.substring(COOKIE_NAME.length+1,cval.length));
ci++;
}
return res;
}function writeIndexToCookie(newIndex)
{
var date=new Date();
date.setTime(date.getTime()+(30*24*60*60*1000)); // expires in 30 days
var cookieStr=COOKIE_NAME+"="+newIndex+"; expires="+date.toGMTString()+"; path=/";
document.cookie=COOKIE_NAME+"="+newIndex+"; expires="+date.toGMTString()+"; path=/";
}// read cookie (or 0)
var cindex=readIndexFromCookie()+1;
// avoid array out of bounds
if (randombgs.length<=cindex) cindex=0;
// write new index to cookie
writeIndexToCookie(cindex);
// show corresponding background
document.write('<body style="background: url('+randombgs[cindex]+');background-repeat: no-repeat; background-position: center; background-color:#000000;" >');</script>
You could alternately: set a message if the cookies are deactivated or simply pick a random image in that case.
Hope this helps anyway,
Elinor
Elinor Hurst
http://elinorhurst.blogspot.com

Ok - you'll want kick me but I dont use this for any business or critical applications - this is only on a page i have set for my active desktop - I use it at and for work and have quite a bit going on with it in the way of links, javascript, iframes, etc.
I guess my real question was if getting the script to go from random to sequential was an easy affair. From my research and asking around it seems like it's not as easy as anticpated. A scripting savvy freind in fact mentioned cookie handling as a resolution. Too much for something as petty as a background change. I will still give your solution a try if only for general curiosity and so your efforts are not in vain.
Thank You again for the replies and help, Elinor

Hi HTPieces,
Not a problem - it was fun :-).
To tell you the truth, a lot of this code I just got from other things I have already written, so not as much trouble as it looks! ;-)You do have to use a cookie because when you refresh (or restart) the browser the previous 'state' (and therefore image index) is lost. The cookie is used to store the array index so that you can skip to the next image when you open the page again.
Any luck on getting it running?
Elinor
Elinor Hurst
http://elinorhurst.blogspot.com

Script works beautifully Elinor. After dropping it in, it just worked, so I'll just keep it right where it is ;). Many thanks for your solution.

![]() |
![]() |
![]() |

This post is quite old and has been locked from receiving new replies. Please create a new posting instead.
| Ads by Google |