PDA

View Full Version : Rotating images


mw2005
09-04-2005, 09:06 AM
Can you rotate images using JavaScript?

_Aerospace_Eng_
09-04-2005, 09:16 AM
Can you be a little more clearer on what you want? You mean like show a random image on each page load or show images in a certain order dependent upon if the user has been to the page or not?

vwphillips
09-04-2005, 11:13 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
var ImgPath='http://www.vicsjavascripts.org.uk/StdImages/';
var ImgAry=new Array('Zero.gif','One.gif','Two.gif','Three.gif','Four.gif','Five.gif');
var ImgAry2=new Array('Cross1.gif','Tick1.gif','Up1.gif','Down1.gif','Left1.gif','Right1.gif');

function RandomImages(id,path,ary){
imgs=document.getElementById(id).getElementsByTagName('IMG');
for (zxc0=0;zxc0<imgs.length;zxc0++){
if (ary[zxc0]){
imgs[zxc0].src=path+ary[zxc0];
}
}
amRandomise(ary);
}

function amRandomise(amAry){
amT0=0;
amTempAry0=new Array();
for (am1=0;am1<amAry.length;am1++){
amTempAry0[am1]='^';
}
while (amT0<amAry.length){
amTemp=Math.floor(Math.random()*amAry.length-1)+1;
if (amTempAry0[amTemp]=='^'){amTempAry0[amTemp]=amAry[amT0]; amT0++; }
}
for (am1=0;am1<amAry.length;am1++){
amAry[am1]=amTempAry0[am1];
}
}

//-->
</script></head>

<body onload="RandomImages('MyRandomImages',ImgPath,ImgAry);RandomImages('MyRandomImages2',ImgPath,ImgAry2);" >
<span id="MyRandomImages" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="50">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="50">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="50">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="50">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="50">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="50">
</span>
<br>
<input type="button" name="" value="Again" onclick="RandomImages('MyRandomImages',ImgPath,ImgAry);">
<br>
<br>
<span id="MyRandomImages2" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="30" height="30">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="30" height="30">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="30" height="30">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="30" height="30">
</span>
<br>
<input type="button" name="" value="Again" onclick="RandomImages('MyRandomImages2',ImgPath,ImgAry2);">
</body>

</html>

mw2005
09-05-2005, 05:01 PM
Thanks for both of your input and thanks vwphillips for giving me the answer, sorry for not being clearer.