JavaScript - Script To Randomize Image Order?

Hi, I was hoping someone might have a solution to randomizing a URL in javascript... in this case for an embedded Simpleviewer link?

At the moment the link is http://timperceval.com/guiran/intro1/ but I would like to have the site randomly choose from four URLs.

The embedded code is as follows:
<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="http://timperceval.com/guiran/intro1/svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
var flashvars = {};
flashvars.baseURL = "http://timperceval.com/guiran/intro1/";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "000000", true, flashvars);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED --

Any ideas would really help!

Thanks,

Tim

I've been banging my head for two days now trying to figure out how i can swap td cells. There are a lot of examples of how to order rows, but i can seem to find any on how to swap td cells. Has anyone a good referal for this.

Hey all,

I have a simple form that looks something like this:

Code:

<div id="responses">
<input class="checkbox" type="checkbox" name="group1" value="1" id="option1"/><label class="label" for="option1">Option one text</label>

<input class="checkbox" type="checkbox" name="group1" value="0" id="option2"/><label class="label" for="option2">Option two text</label>

<input class="checkbox" type="checkbox" name="group1" value="1" id="option3"/><label class="label" for="option3">Option three text</label>
</div>

I am trying to figure out a way to use javascript to take these and randomize the order of them. For example, if you were looking at it and clicked a randomize button it would shuffle around the options. I am fairly new to javascript and don't really know where to start with something like this. I would greatly appreciate it if someone could get me started or point me in the right direction.

Thanks!

Using the Photoslide, GK News Image VI, as seen here tools.gavick.com/demo/ni6, however its in ID order, listed.

I would like to change the order of ID to Random Order. Can you please help, what code would need changing. thank you

its javascript.

code below:

Fx.Height = Fx.Style.extend({initialize: function(el, options){$(el).setStyle('overflow', 'hidden');this.parent(el, 'height', options);},toggle: function(){var style = this.element.getStyle('height').toInt();return (style > 0) ? this.start(style, 0) : this.start(0, this.element.scrollHeight);},show: function(){return this.set(this.element.scrollHeight);}});Fx.Opacity = Fx.Style.extend({initialize: function(el, options){this.now = 1;this.parent(el, 'opacity', options);},toggle: function(){return (this.now > 0) ? this.start(1, 0) : this.start(0, 1);},show: function(){return this.set(1);}});
//
window.addEvent("load",function(){
document.getElementsBySelector(".gk_ni_6_wrapper").each(function(el){
// generowanie rdzenia
var mainwrap = el;
var elID = el.getProperty("id");
var $G = $Gavick[elID];
var wrap = $(elID);
var mouseIsOver = false;
var scrollValue = 0;


//
var addWidth = $E("div",el).getStyle("padding-left").toInt() + $E("div",el).getStyle("padding-right").toInt() + $E("div",el).getStyle("margin-right").toInt();
//
el.setStyle("width",(el.getStyle("width").toInt() + addWidth) + "px");
//
$G["actual_slide"] = -1;
$G["actual_anim"] = false;
$G["actual_anim_p"] = false;
//
var slides = [];
var contents = [];
var pasek = false;
//
if(window.ie && $E(".gk_ni_6_text_bg", wrap)) $E(".gk_ni_6_text_bg",wrap).setOpacity($G["opacity"].toFloat());
//
wrap.getElementsBySelector(".gk_ni_6_slide").each(function(elmt,i){slides[i] = elmt;});
slides.each(function(el,i){if(i != 0) el.setOpacity(0);});
//
if($E(".gk_ni_6_text_bg", wrap)){
var text_block = $E(".gk_ni_6_text_bg",wrap);
$ES(".gk_ni_6_news_text",wrap).each(function(el,i){contents[i] = el.innerHTML;});
}
// animacje
var amount_c = contents.length-1;
if($E(".gk_ni_6_text", wrap)) $E(".gk_ni_6_text",wrap).innerHTML = contents[0];
//
var loadedImages = ($E('.gk_ni_6_preloader', wrap)) ? false : true;
//
if($E('.gk_ni_6_preloader', wrap)){
var imagesToLoad = [];
//
$ES('.gk_ni_6_slide',wrap).each(function(el,i){
var newImg = new Element('img',{
"src" : el.innerHTML,
"alt" : el.getProperty('title')
});
imagesToLoad.push(newImg);
el.innerHTML = '';
newImg.injectInside(el);
});
//
var timerrr = (function(){
var process = 0;
imagesToLoad.each(function(el,i){
if(el.complete) process++;
});
//
if(process == imagesToLoad.length){
$clear(timerrr);
loadedImages = process;
(function(){new Fx.Opacity($E('.gk_ni_6_preloader', wrap)).start(1,0);}).delay(400);
}
}).periodical(200);
}

var timerrr2 = (function(){
if(loadedImages){
$clear(timerrr2);
// ----------
var NI2 = new news_image_6();
//
$ES(".gk_ni_6_tab",mainwrap).each(function(elx,index){
var hover = $E(".gk_ni_6_hover" , elx);
var opacity_anim = new Fx.Opacity(hover, {duration: 250, wait: false});
//
elx.addEvent("mouseenter",function(){
hover.setStyle("display", "block");
opacity_anim.start(1);
});
//
elx.addEvent("mouseleave",function(){
opacity_anim.start(0);
(function(){hover.setStyle("display", "none");}).delay(250);
});
//
elx.addEvent("click", function(){
if(!$G["actual_anim_p"]){
$E(".gk_ni_6_tab_active",mainwrap).setProperty("class","gk_ni_6_tab");
elx.setProperty("class","gk_ni_6_tab_active");
}
//
NI2.image_anim(elID,mainwrap,wrap,slides,index,contents,$G,false);
});
});

$E(".gk_ni_6_tab",mainwrap).setProperty("class","gk_ni_6_tab_active");
NI2.image_anim(elID,mainwrap,wrap,slides,0,contents,$G,($G["autoanim"]==1));
/** Slider implementation **/
if($E('.gk_ni_6_tabsbar_slider',mainwrap)){
var $offset = $E(".gk_ni_6_tab",mainwrap).getStyle("height").toInt() + $E(".gk_ni_6_tab",mainwrap).getStyle("margin-bottom").toInt();
var scrollArea = $E('.gk_ni_6_tabsbar_wrap', mainwrap);
var scrollableArea = $E('.gk_ni_6_tabsbar', mainwrap);
var scrollAreaH = scrollArea.getSize().size.y;
var scrollableAreaH = scrollableArea.getSize().size.y;
var scroller_up = new Fx.Scroll(scrollArea, {duration: 250, wait: true, transition: Fx.Transitions.Circ.easeIn, onComplete: function(){scrollValue -= $offset;}});
var scroller_down = new Fx.Scroll(scrollArea, {duration: 250, wait: true, transition: Fx.Transitions.Circ.easeIn, onComplete: function(){scrollValue += $offset;}});
//
$E('.gk_ni_6_tabsbar_up', mainwrap).addEvent("click",function(){
if(scrollValue > 0) { scroller_up.scrollTo(0, scrollValue-$offset);}
});
//
$E('.gk_ni_6_tabsbar_down', mainwrap).addEvent("click",function(){
if((scrollValue < (scrollableAreaH-scrollAreaH))) { scroller_down.scrollTo(0, scrollValue+$offset); }
});
}
}}).periodical(250);
});
});
//
var news_image_6 = new Class({
//
text_anim : function(wrap,contents,$G){
var txt = $E(".gk_ni_6_text",wrap);
if(txt){
if($G["anim_type_t"] == 0){
new Fx.Opacity(txt,{duration: $G["anim_speed"]/2}).start(1,0);
(function(){
new Fx.Opacity(txt,{duration: $G["anim_speed"]/2}).start(0,1);txt.innerHTML = contents[$G["actual_slide"]];
}).delay($G["anim_speed"]);
}
else txt.innerHTML = contents[$G["actual_slide"]];
}
},
//
image_anim : function(elID,mainwrap,wrap,slides,n,contents,$G,play){
var max = slides.length-1;
var links = $ES('.gk_ni_6_news_link', mainwrap);
var readon = $E('.gk_ni_6_readmore_button a', mainwrap);

if(!$G["actual_anim_p"] && n != $G["actual_slide"]){
$G["actual_anim_p"] = true;
if(readon) readon.setProperty("href", links[n].innerHTML);
var actual_slide = $G["actual_slide"];
$G["actual_slide"] = n;
slides[n].setStyle("z-index",max+1);

if(actual_slide != -1) new Fx.Opacity(slides[actual_slide],{duration: $G["anim_speed"]}).start(1,0);
new Fx.Opacity(slides[n],{duration: $G["anim_speed"]}).start(0,1);
this.text_anim(wrap,contents,$G);

switch($G["anim_type"]){
case 0: break;
case 1: new Fx.Style(slides[n],'margin-top',{duration: $G["anim_speed"]}).start((-1)*slides[n].getSize().size.y,0);break;
case 2: new Fx.Style(slides[n],'margin-left',{duration: $G["anim_speed"]}).start((-1)*slides[n].getSize().size.x,0);break;
case 3: new Fx.Style(slides[n],'margin-top',{duration: $G["anim_speed"]}).start(slides[n].getSize().size.y,0);break;
case 4: new Fx.Style(slides[n],'margin-left',{duration: $G["anim_speed"]}).start(slides[n].getSize().size.x,0);break;
}

if(play){
$E(".gk_ni_6_tab_active",mainwrap).setProperty("class","gk_ni_6_tab");
$ES(".gk_ni_6_tab",mainwrap)[n].setProperty("class","gk_ni_6_tab_active");
}

(function(){slides[n].setStyle("z-index",n);}).delay($G["anim_speed"]);
(function(){$G["actual_anim_p"] = false;}).delay($G["anim_speed"]);

var $this = this;

if(!play) this.image_pause($G);
if((play || $G["autoanim"] == 1) && ($G["actual_anim"] == false)){
$G["actual_anim"] = (function(){
n = (n < max) ? n+1 : 0;
$this.image_anim(elID,mainwrap,wrap,slides,n,contents,$G,true);
}).periodical($G["anim_speed"] * 2 + $G["anim_interval"]);
}
}
},
//
image_pause : function($G) { $clear($G["actual_anim"]); $G["actual_anim"] = false; }
});

Hi,

Im using a authoring tool to develop an elearning test course. The course is composed of several HTML pages with Buttons for the multiple choice test. The setup of the course is that it will only ask 10 questions out of a pool of 30 questions.

When the HTML & JS files are online, the test takes 20-40seconds to load. I believe it is related to the code that selects the 10 questions from the 30.

I've singled out the code that does the select random pages... Is there any way to optimize the code?

I've attached the HTML (in txt format) page where the javascript can be found.

Looking forward to your replies!

Here's what I usually use and have been using for years and it works great, just not for this particular purpose. I don't have a clue when it comes to javascript.

Code:

<noscript><img src="no_script_quote.gif" width="406" height="94"/></noscript><script language="javascript">

var delay=6000
var curindex=0

var images=new Array()

	images[0]="quote1.gif"
	images[1]="quote2.gif"
	images[2]="quote3.gif"
	images[3]="quote4.gif"
	images[4]="quote5.gif"

var preload=new Array()

for (n=0;n<images.length;n++)
{
	preload[n]=new Image()
	preload[n].src=images[n]
}

document.write('<img name="defaultimage" src="'+images[Math.floor(Math.random()*(images.length))]+'">')

function rotateimage()
{

if (curindex==(tempindex=Math.floor(Math.random()*(images.length)))){
curindex=curindex==0? 1 : curindex-1
}
else
curindex=tempindex

	document.images.defaultimage.src=images[curindex]
}

setInterval("rotateimage()",delay)
</script>

But, now I want to be able to set a default picture to be shown first and have the random pics appear next. I also don't want the default pic to show up again in the random array. So basically, every time the page was first visited, or refreshed it would show the default picture then move into the random pics.

Is there anyway to modify the code that I'm using to accomplish this? Or... Any help would be appreciated.

Thanks,
Dell

Hi, im wondering if anyone can help me, i have a random image script and it works fine, apart from when you click on the images they link to the right place but ALL go to _self

I want [2],[3]and[6] to link to the places they are already linking to but _blank NOT _self, does anyone know how to do this, it would be a massive help :)

Below is the code for the script i am using:

Code:

	<script language="JavaScript">
function random_imglink(){
  var myimages=new Array()
  //specify random images below. You can have as many as you wish
  myimages[1]="images/layout/bottom gallery.png"
  myimages[2]="images/layout/bottom facebook.png"
  myimages[3]="images/layout/bottom twitter.png"
  myimages[4]="images/layout/bottom team.png"
  myimages[5]="images/layout/bottom whats on.png"
  myimages[6]="images/layout/bottom forum.png"

  //specify corresponding links below
  var imagelinks=new Array()
  imagelinks[1]="gallery.html"
  imagelinks[2]="http://www.facebook.com/tos.php?api_key=fcddbaae811ef62bf3c4fb2ac7b1fd07&next=http%3A//dailyphoto-1402445175.us-east-1.elb.amazonaws.com/dailyphoto/applications/buffer/id%3A1/pid%3A2828044108236222753/from%3Apublisher.attachment.own.image?ref=nf&v=1.0&canvas#/group.php?gid=87957825200&ref=ts"
  imagelinks[3]="https://twitter.com/groundzereo"
  imagelinks[4]="team.html"
  imagelinks[5]="whatson.html"
  imagelinks[6]="http://groundzero.forumotion.co.uk/"

  var ry=Math.floor(Math.random()*myimages.length)

  if (ry==0)
     ry=1
     document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
}

  random_imglink()
//-->
</script>

Thanks in advance =)

I've got an old school script running a static slide show, but it's not showing the ninth image - regardless of what the image is (ruling out a typo in my image file).
Here's the page and script: http://www.agwprefinished.com/handpainted.asp
Code:

<SCRIPT LANGUAGE="JavaScript">
<!--

/*
Script by FPMC at http://jsarchive.8m.com
Submitted to JavaScript Kit (http://javascriptkit.com)
For this and 400+ free scripts, visit http://javascriptkit.com
*/

//set image paths
src = [ "images/faux-stone.jpg",
           "images/dining-inlay.jpg", 
          "images/dining-inlay-detail.jpg",
	"images/faux-inlaid-marble-limestone.jpg",
	"images/faux-marble-inlay-manhattan.jpg",
	"images/foyer-inlay.jpg",
	"images/foyer-inlay-detail.jpg",
	"images/weathered-grain-1.jpg",
	"images/weathered-grain-detail.jpg", 
	"images/weathered-grain-2.jpg",
        "images/weathered-grain-3.jpg",
	"images/ebonized-oak.jpg",
	"images/aged-oak.jpg",
	"images/ebonized-oak-transition.jpg",
	"images/sample.jpg",
	"images/faux-marble-tile.jpg",
	"images/faux-marble-tile-2.jpg",
	"images/faux-marble-medallion.jpg",
	"images/metallic-1.jpg",
	"images/metallic-2.jpg",
	"images/painted-pattern-bath.jpg",
	"images/painted-pattern-detail.jpg",
	"images/faux-parkay-4.jpg",
	"images/faux-parkay-3.jpg",
	"images/faux-parkay-2.jpg",
	"images/border-stencil-1.jpg",
	"images/border-stencil-2.jpg",
	"images/monogram.jpg",
	"images/dining-stencil.jpg",
	"images/reproduction-border.jpg",
	"images/reproduction-border-detail.jpg",
	"images/reproduction-hall.jpg",
	"images/inlay-pattern-hall.jpg",
	"images/modello-samples-1.jpg",
	"images/modello-samples-2.jpg",
	"images/pavlosk-inlay-imitation.jpg",
	"images/st-peter-inlay.jpg",
	]


//set corresponding urls
url = [""]

//set duration for each image
duration = 4;

//Please do not edit below
ads=[]; ct=0;
function switchAd() {
var n=(ct+1)%src.length;
if (ads[n] && (ads[n].complete || ads[n].complete==null)) {
document["Ad_Image"].src = ads[ct=n].src;
}
ads[n=(ct+1)%src.length] = new Image;
ads[n].src = src[n];
setTimeout("switchAd()",duration*1000);
}
function doLink(){
location.href = url[ct];
} onload = function(){
if (document.images)
switchAd();
}
//-->
</SCRIPT>

I'm trying to create a script that will allow me to shuffle a number of images saved in the same folder as the HTML file using the script, and then write them to the page. I have the whole script/page written out but it doesn't seem to be working and I can't divine why. If anyone could look at this code and tell me what's wrong with it I'd really appreciate it:

Code:

<html>
<head>
<title>dripppz</title>
<script language="JavaScript">
private function shuffle(a:Array):void {
 for (var i:uint = 0; i < a.length; i++) {
  var tmp:Object = a[i];
  var randomNum:Number = Math.round(Math.random() * (a.length-1));
  a[i] = a[randomNum];
  a[randomNum] = tmp;
 }
}

var Image:Array = ('dripppz1.gif', 'dripppz2.gif', 'dripppz3.gif', 'dripppz4.gif', 'dripppz5.gif', 'dripppz6.gif', 'dripppz7.gif', 'dripppz8.gif', 'dripppz9.gif', 'dripppz10.gif', 'dripppz11.gif', 'dripppz12.gif', 'dripppz13.gif', 'dripppz14.gif', 'dripppz15.gif', 'dripppz16.gif', 'dripppz17.gif', 'dripppz18.gif', 'dripppz19.gif', 'dripppz20.gif', 'dripppz21.gif', 'dripppz22.gif', 'dripppz23.gif', 'dripppz24.gif', 'dripppz25.gif', 'dripppz26.gif', 'dripppz27.gif', 'dripppz28.gif', 'dripppz29.gif', 'dripppz30.gif', 'dripppz31.gif', 'dripppz32.gif'); 
shuffle(Image);
trace(Image);
function showImages(){

document.write('<img src="'+Image[0]+'" />');
document.write('<img src="'+Image[1]+'" />');
document.write('<img src="'+Image[2]+'" />');
document.write('<img src="'+Image[3]+'" />');
document.write('<img src="'+Image[4]+'" />');
document.write('<img src="'+Image[5]+'" />');
document.write('<img src="'+Image[6]+'" />');
document.write('<img src="'+Image[7]+'" />');
document.write('<img src="'+Image[8]+'" />');
document.write('<img src="'+Image[9]+'" />');
document.write('<img src="'+Image[10]+'" />');
document.write('<img src="'+Image[11]+'" />');
document.write('<img src="'+Image[12]+'" />');
document.write('<img src="'+Image[13]+'" />');
document.write('<img src="'+Image[14]+'" />');
document.write('<img src="'+Image[15]+'" />');
document.write('<img src="'+Image[16]+'" />');
document.write('<img src="'+Image[17]+'" />');
document.write('<img src="'+Image[18]+'" />');
document.write('<img src="'+Image[19]+'" />');
document.write('<img src="'+Image[20]+'" />');
document.write('<img src="'+Image[21]+'" />');
document.write('<img src="'+Image[22]+'" />');
document.write('<img src="'+Image[23]+'" />');
document.write('<img src="'+Image[24]+'" />');
document.write('<img src="'+Image[25]+'" />');
document.write('<img src="'+Image[26]+'" />');
document.write('<img src="'+Image[27]+'" />');
document.write('<img src="'+Image[28]+'" />');
document.write('<img src="'+Image[29]+'" />');
document.write('<img src="'+Image[30]+'" />');
document.write('<img src="'+Image[31]+'" />');
}
</script>
</head>
<body bgcolor="#ffffff">
<script language="JavaScript">

showImages();

</script>
</body>
</html>

Does anyone have a script, that can display a random image of the images I select?I'm going to use it for a type of captcha. I think this would be easier in javascript, so yes I am in the right section.

I want to make a script selecting electronics category in this site http://eu.redeem-it.net/boutique.php
A friend told me to use getElementsByClass but I still cant do it.

Hey all,

I am trying to get a code instead of php to display a image from a questionaire results page;

Say the url returns;
http://localhost/Myoka2/myokaTestResults.php?img=7

the 7 will show score2.png... this works fine with php, here is the code

<?php
$total = $_GET['img'];
if ($total < 7)
$total = 1;
elseif ($total < 13)
$total = 2;
elseif ($total < 18)
$total = 3;
elseif ($total < 20)
$total = 4;
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Contact Form</title>
<script src="rollover.js" type="text/javascript"></script>
<link rel="stylesheet" href="http://dl.dropbox.com/u/25307673/myoka/myokaStyle.css" type="text/css" media="screen" />
</head>

<body>
<span style="color:#6A1E67;font: normal bold 12pt/14pt Arial, Helvetica, sans-serif;margin-left:140px;">
How stressed are you?
<h3>SCORES</h3>
</span>

<img src="http://dl.dropbox.com/u/25307673/myoka/myokaStress/score<?php echo $total; ?>.png" alt="" /><br />

<a href="http://www.facebook.com/myoka.spas?sk=app_128953167177144" target="_blank">
<img src="http://dl.dropbox.com/u/25307673/myoka/myokaFanPage//lastMin.jpg" style="padding-left:0px; padding-top:5px; border:0px" alt="" />
</a>
<br/>
</body>
</html>


What i need is this in javascript so that it will work in a iframe :-)

I need a script and HTML code for an image effect like this: http://www.saksfifthavenue.com/main/...11947&ev19=1:2 Something very easy, if possible. Thanks.

I don't know if this is possible, so I figured I'd ask a few gurus. I know it is possible to have an image change at a certain time of day, and it's also possible to have an image change by day, but is there a script to do both?

What I want to do is have the first image show from 8am cst to 6pm cst mon-fri, it's our open sign for live chat. The the rest of the time have the second image.

Is this possible with any type of script? Any help you can give is greatly appreciated!

I have a banner ad with an image rotation embedded in a DIV. It works quite fine, but doesn't have required SEO info, ie: alt text.

Here is the code that is working.

Code:

<div style="background-image: url(http://www.earthwindwater.com.au/banners/skiracersworld/banner-bg.png);height:148px;width:982px;border:0px;">
<div style="float:left;height:148px;border:0px;">
<a href="http://www.earthwindwater.com.au" target="_blank"><img border=0 align="absmiddle" alt="Earth Wind and Water Sports Action Cameras" src="http://www.earthwindwater.com.au/banners/skiracersworld/EWW-logo.png" /></a>
</div>
<div style="height:148px;border:0px;float:right;padding-right:415px; ">
<a id="imageurl" target="_blank" ><img id="Rotating1" border="0"></img></a>
<script language="JavaScript">
  
   function RotateImages(Start)
  {
      var a = new Array("http://www.earthwindwater.com.au/banners/skiracersworld/Contour+.png","http://www.earthwindwater.com.au/banners/skiracersworld/LiquidImage.png","http://www.earthwindwater.com.au/banners/skiracersworld/ContourGPS.png", "http://www.earthwindwater.com.au/banners/skiracersworld/GoPro.png");
      var c = new Array("http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/contour", "http://www.earthwindwater.com.au/store/cameras/hd-cameras/impact-series-720p-mx-goggle-red", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/contourgps", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/gopro-hd-motorsports-hero");
      var b = document.getElementById('Rotating1');
      var d = document.getElementById('imageurl');
      if(Start>=a.length)
          Start=0;
      b.src = a[Start];
      d.href = c[Start];
      window.setTimeout("RotateImages(" + (Start+1) + ")",5000);
  }
  
  RotateImages(0);
  
  </script>
</div>
</div>

Now, I thought I would modify the code a little and include "Image Title" and "ALT Text"

I am not much of a scripting genius, therefore my modifications don't work.

Here is my modified code

Code:

<div style="background-image: url(http://www.earthwindwater.com.au/banners/skiracersworld/banner-bg.png);height:148px;width:982px;border:0px;">
<div style="float:left;height:148px;border:0px;">
<a href="http://www.earthwindwater.com.au" target="_blank"><img border=0 align="absmiddle" alt="Earth Wind and Water Sports Action Cameras" src="http://www.earthwindwater.com.au/banners/skiracersworld/EWW-logo.png" /></a>
</div>
<div style="height:148px;border:0px;float:right;padding-right:415px; ">
<a id="imageurl" target="_blank" ><img id="Rotating1" id="imagealt" id="imagetitle" border="0"></img></a>
<script language="JavaScript">
  
   function RotateImages(Start)
  {
      var a = new Array("http://www.earthwindwater.com.au/banners/skiracersworld/Contour+.png","http://www.earthwindwater.com.au/banners/skiracersworld/LiquidImage.png","http://www.earthwindwater.com.au/banners/skiracersworld/ContourGPS.png", "http://www.earthwindwater.com.au/banners/skiracersworld/GoProHDHERO2.png");
      var c = new Array("http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/contour", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/impact-series-hd-1080p-mx-video-goggle-white", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/contourgps", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/gopro-hd-hero2-motorsports-edition");
      var e = new Array("Contour+", "Impact Series HD 1080p MX Video Goggle", "ContourGPS", "GoPro HD HERO2 Motorsport Edition");
      var g = new Array("Contour+", "Impact Series HD 1080p MX Video Goggle", "ContourGPS", "GoPro HD HERO2 Motorsport Edition");
      var b = document.getElementById('Rotating1');
      var d = document.getElementById('imageurl');
      var f = document.getElementById('imagealt');
      var h = document.getElementById('imagetitle');
      if(Start>=a.length)
          Start=0;
      b.src = a[Start];
      d.href = c[Start];
      f.alt = e[Start];
      h.title = g[Start];
      window.setTimeout("RotateImages(" + (Start+1) + ")",5000);
  }
  
  RotateImages(0);
  
  </script>
</div>
</div>

Any ideas how I can get this to work