logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > Javascript and JS frameworks
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 05-21-2008, 12:31 AM   #1
cocoonfx
cocoonfx's Avatar
 
Join Date: Nov 2006
Location: Tamworth,UK
Posts: 576
Default Help! Random Images

Hello Chaps


I have found the following code for selecting images and randomly selecting them. I then want to have three thumbnails which display 3 different images. However at present i can have 3 of the same images showing.

What i want to do is make sure that the 3 thumbnail boxes never select the same image. As i am still working out java i am not sure how to do this.

My code is below, and this is what it looks like www.somethingsiam.com its the 3 images down the right side. HELP!

Code:
 
<script type="text/javascript" language="JavaScript">
NumberOfImagesToRotate = 20;
 
FirstPart = '<img src="image';
LastPart = '.jpg" width="125" height="125">';
 
function printImage() {
var r = Math.ceil(Math.random() * NumberOfImagesToRotate);
document.write(FirstPart + r + LastPart);
}
//-->
</script>
 
<div id="right">
<p>
<div class="thumb"><script type="text/javascript" language="JavaScript"><!--
printImage();
//--></script></div>
<div class="thumb"><script type="text/javascript" language="JavaScript"><!--
printImage();
//--></script></div>
<div class="thumb"><script type="text/javascript" language="JavaScript"><!--
printImage();
//--></script></div>
cocoonfx is offline   Reply With Quote
Old 05-21-2008, 06:35 AM   #2
davidj
davidj's Avatar
 
Join Date: Sep 2005
Location: The Toon (newcastle upon Tyne)
Posts: 8,256
Default

are your images named numericaly
__________________
Would you like to learn PHP from me? Check out -> www.codezenith.co.uk
davidj is offline   Reply With Quote
Old 05-21-2008, 06:45 AM   #3
cocoonfx
cocoonfx's Avatar
 
Join Date: Nov 2006
Location: Tamworth,UK
Posts: 576
Default Hello

Hello Dj


Yes i.e images1 to images20
cocoonfx is offline   Reply With Quote
Old 05-21-2008, 09:16 PM   #4
ranjan
 
Join Date: Dec 2004
Posts: 405
Default

Paste in head of document

Code:
<script type="text/javascript">
Array.prototype.shuffle = function() {//extend array to shuffle
   var myArray = new Array();
   for (i=0; i<this.length; i++) {
      var control = true;
      while (control) {
         j = Math.floor(Math.random()*this.length);
         if (myArray[j] == undefined) {
            myArray[j] = this[i];
            control = false;
         }
      }
   }
   return myArray;
};
function shuffleNumbers(max) {
	allNumbers = new Array(); //generate array
	for(i=0; i<max; i++){
 	   	allNumbers[i] = i+1;
	}
	var shuffled = allNumbers.shuffle(); //shuffle it
	return shuffled;
}
window.onload = function() {
	var noOfImages = 20; // number of images
	var shuffledImages = shuffleNumbers(noOfImages); //shuffle them
	var imgHTML = '<img src="image'+shuffledImages[0]+'.jpg">'+'<img src="image'+shuffledImages[1]+'.jpg">'+'<img src="image'+shuffledImages[2]+'.jpg">'; //first 3 in shuffled
	document.getElementById('randomImages').innerHTML = imgHTML; //write the HTML
}
</script>
Paste inside you div id=right

Code:
<div id="randomImages"></div>
ranjan is offline   Reply With Quote
Old 05-21-2008, 09:45 PM   #5
pete
 
Join Date: Apr 2008
Location: in a bin
Posts: 113
Default

Ranjan, great solution but not sure you should be modifying core JS objects
pete is offline   Reply With Quote
Old 05-21-2008, 10:22 PM   #6
ranjan
 
Join Date: Dec 2004
Posts: 405
Default

I am just extending the object... the core methods are

http://www.w3schools.com/jsref/jsref_obj_array.asp

I just added a custom method (shuffle) in addition to the default ones.

Basic OOP
ranjan is offline   Reply With Quote
Old 05-21-2008, 10:49 PM   #7
cocoonfx
cocoonfx's Avatar
 
Join Date: Nov 2006
Location: Tamworth,UK
Posts: 576
Default hello

IT works which is excellent, thank you for your help. I know have to understand the code
cocoonfx is offline   Reply With Quote
Old 05-21-2008, 10:59 PM   #8
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Cocoon, I've heard 'Simply Javascript' from Sitepoint is an awesome starting book
domedia is offline   Reply With Quote
Old 05-21-2008, 11:03 PM   #9
cocoonfx
cocoonfx's Avatar
 
Join Date: Nov 2006
Location: Tamworth,UK
Posts: 576
Default

Cheers domedia i will have a look at amazon.
cocoonfx is offline   Reply With Quote
Old 05-22-2008, 09:00 AM   #10
pete
 
Join Date: Apr 2008
Location: in a bin
Posts: 113
Default

Quote:
Originally Posted by ranjan View Post
I am just extending the object... the core methods are

http://www.w3schools.com/jsref/jsref_obj_array.asp

I just added a custom method (shuffle) in addition to the default ones.

Basic OOP
My point is it has the potential to break other scripts, however in this case I assume it is doubtful that will happen. There was a big debate about Prototype breaking scripts and many developers warn against using Prototype.
pete is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 05:42 AM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com