ansaurus

Question

How do I changes this code to make images rotate on refresh?

Answer 1

A:

this is just a shot in the dark

<body onload="rotateImage();">

rockinthesixstring 2010-01-25 00:16:11

Thanks dude I'll take that shot and try it.

JamieD 2010-01-25 01:02:15

Answer 2

+1 A:

I would recommend you use a random starting image to give the illusion of change on each page load/refresh. Otherwise you are left with writing a cookie of the last viewed image and showing the next one on page load:

Change the first two lines as follows (notice I reverse their order on purpose):

num_images = 9;
// Pick a random starting number
counter = Math.ceil(Math.random() * num_images);

Of course there is the possibility of the same image randomly appearing again in a row, but it will probably be very close to what you want.

Doug Neiner 2010-01-25 00:25:58

Or as Charlie Epps would say... "there's no such thing as a truly random number"... jk

rockinthesixstring 2010-01-25 00:33:10

@rockinthesixstring Haha... I should have given code for using JSONP to pull a random number from a radioactive decay random number service :)

Doug Neiner 2010-01-25 00:35:08

HAHAH yeah I think that would have been appropriate as I'm gonna use the script on a site called IAMANATOM !!!

JamieD 2010-01-25 00:57:49

@JamieD this solution uses your existing script, it just starts on a different image each time. All subsequent rotation would not be random, but sequential according to your existing script.

Doug Neiner 2010-01-25 01:11:33

Answer 3

A:

Here is a simple approach to illustrate the concept that can be adapted to what you want. Put this in the header of the page:

<?php global $banner_id;  ?>
<?php   $banner_id=rand(0,N);  ?>
<style type="text/css">
  #header_image {
    background: #000000 url("/path_to_image_files/image_<?php echo($banner_id); ?>.jpg") top center no-repeat;
    }
</style>

Here $banner_id=rand(0,N); grabs a random number from zero to N. You of course insert your file path to the images you want to randomize and then in this case that should be a folder with images labeled, 'image_N.jpg' where N is randomized as expected. Also you will need to include this to declare a global variable to retrieve it later:

  <?php global $banner_id;  ?>

Then inside the body of your page simply use this div where you want the random image.

<div id="header_image">

Alex 2010-01-25 00:28:19

Thanks guys on the randomising suggestions definitely useful however I want to stick with the script I have due to the wonderful fade in fade out.

JamieD 2010-01-25 01:01:51

ansaurus

tags:

views:

answers:

How do I changes this code to make images rotate on refresh?

related questions