PDA

View Full Version : I need a random images script

TheBlueDragon
21-09-2006, 09:58
Hi,
I wonder if anyone can help me. I need a random image script for a website, but I need one that will allow me to have 4 areas on 1 webpage which all show different radom images

[images 1, 2, 3, 4]

[images 5, 6, 7, 8]

[images 9 10, 11, 12]

[images 13, 14, 15, 16]

If you get what I mean
________
Babe Video (http://www.****tube.com/categories/6/babe/videos/1)
Stuff
21-09-2006, 10:03
Which technology are you using? Client-side or server-side?

If client-side, try looking for a Javascript on: The Javascript Source (http://javascript.internet.com/)
steev
21-09-2006, 10:07
How about using java?

This in a .js file...

var imageArray = new Array();

imageArray[0] = new Image();
imageArray[0].src = "/images/myimage1.jpg";
imageArray[1] = new Image();
imageArray[1].src = "/images/myimage2.jpg";

var imageCounter = 0;

function rotateImages()
{
var myImage = document.getElementById("myimage");
myImage.src = imageArray[imageCounter++].src;

if( imageCounter == imageArray.length)
{
imageCounter = 0;
}

setTimeout("rotateImages()", 10000);
}


This in the <head>...

<script type="text/javascript" src="myimage.js"></script>

& then this...

<img id="myimage">

where you want it...

I think that's all you need?
TheBlueDragon
21-09-2006, 10:25
I cant seem to get that to work,

Click here to view the page (http://www.ciarts.co.uk/events_darkwood.htm)

Click here to view the script (http://www.ciarts.co.uk/myimage.js)

and these are the first 4image I want to use for the image on the top right of the webpage

www.ciarts.co.uk/img/marginimages/lantern1.jpg
www.ciarts.co.uk/img/marginimages/lantern2.jpg
www.ciarts.co.uk/img/marginimages/lantern3.jpg
www.ciarts.co.uk/img/marginimages/lantern4.jpg
________
Low Cost Vaporizer (http://vaporizer.org/reviews)
steev
21-09-2006, 11:11
Er... :confused:

I seem to remember there was something daft that stopped it working...

"<img id=\"myimage\" border=\"0\" width=\"732\" height=\"210\" />";

The original (working) use has the image width/height specified as above...

other than that try on hotscripts, there was something very similar there, but with better documentation than me going er... :hihi:
Stuff
21-09-2006, 11:17
How about using java?

That's Javascript, not Java :)
steev
21-09-2006, 11:20
That's Javascript, not Java :)

Tch, whatevvuh :D :P

As you can tell by my last post, I know neither :thumbsup:
mr chris
21-09-2006, 12:21
I have found a php based solution, so providing your server supports it, it'll work even on java-disabled machines, and will make for cleaner source code.

http://alistapart.com/articles/betterrotator/

It works for me (I use it to change the image on my homepage...), and allows for placement of images anywhere on the page using simple <?php include.... ?> tags. You also don't need to know how to use php to get it to work!

PM me if you have any difficulties or questions :thumbsup:
21steve
21-09-2006, 13:29
php
$dh = opendir(".");
while (false !== ($file = readdir($dh)))
{
if (preg_match('/\.jpg$/i', $file) and $file != "avatar.jpg")
{
$filelist[] = $file;
}
}

srand((double)microtime()*1000000);
$picnum = rand(0, sizeof($filelist) - 1);

header("Location: " . $filelist[$picnum]);

closedir($dh);
?
Nazo
21-09-2006, 15:35
Are you trying to have an image that changes each time the person visits the page or one that changes periodically while the user is viewing the page?
The script that Steev posted will do the latter and won't work for multiple images without some modification (and won't do anything without an onload="rotateImages()" in your body tag, which is probably why you aren't seeing any results). If this is the effect you are going for however, Javascript is the way to go.
If you are going for the former then I'd say a server side script is preferable but it's still doable in Javascript if that's not an option. If you've php available then you're already sorted. :thumbsup:
hitchhiker
22-09-2006, 19:47
This PHP solution works and you can easily modify it to suit.

Create a folder in the website directory call 'images' and put your images in there.

create a folder in the website directory called 'random'.

In that folder create 4 html files caled '1.html', '2.html', etc.

in each of the html files put this code in: (for each one amend the image name, obviously)

<?
$x = 1;

$random = array(
'image_1.jpg',
'image_2.jpg',
'image_3.jpg',
'image_4.jpg',

);

shuffle($random);

while($x <= 1){
$x++;

echo "<img src='images/", $random[$x] , "' width='[image width]' height='[image height]' alt='[alt text here]'>";
}
?>

(also adjust the stuff in the square brackets)

(If you want it to output twice or more, change the $x value)

Now put this code in to your web page at the first location (page must have .php ext):

<?php include("random/1.html"); ?>

Then this at the second:

<?php include("random/2.html"); ?>

etc.

The output will be:

"<img src='images/[random image]' width='150' height='150' alt='text'>