Trying to click (onClick) an animated gif image of an on/off switch to start a second animation which is located on a different location on the web-page (a 7-frame animation of a generator with moving parts) immediately followed by a random image selection function placing an image in a 3rd location on the page (next to the generator image). The random images are supposed to look like the result of the generator animation---the item that “pops out” of the generator.

We thought the process to achieve this would be an “OnClick” on the on/off switch-animated-gif to start two javascript functions (generato animation function & random image function).

To further complicate matters, we are doing this website in iWeb. We’re using iWeb SEO Tool to add the javascript to the header and HTML snippet in iWeb to place the HTML code. Not sure we’re actually doing the snippet right though---is it supposed to relate to the images---or is it separate? When the gifs are place on the iweb page, they work in the browser upon page load---the “on-click” & the random image function are NOT working...so we know we’ve done something(s) wrong.

We’re thinking that we’re probably missing some code that describes where the 3 different image-spots are on the page (image #1 is the on/off switch gif, image#2 is the generator gif, image#3 is the generator output.png)....or just aren’t coding the string of functions correctly---or maybe our strategy for achieving this is just no correct (?).

Here is the code we have tried that didn’t work. We desperately need a solution quickly and are open to any/other ideas for how to accomplish this. THANKS YOU in advance for your help!!!:



Code:
script language = JAVASCRIPT>
<!-- Hide script from old browsers

function gif_animation(){
if (document.images)
    generator = new Image
    generator_on = new Image
        
    generator.src = "christmas_sweater_generator-offswitch.gif"
    generator_on.src = "christmas_sweater_generator_on-offswitch.gif"
}
// Stop hiding script from older browsers -->

}
/*
Random Image Link Script
By Website Abstraction (http://www.wsabstract.com)
and Java-scripts.net (http://www.java-scripts.net)
*/

function random_imglink(){
  var myimages=new Array()
  //specify random images below. You can have as many as you wish
  myimages[1]="christmas_sweater_GENERATOR_files/cotton_candy_christmas_sweater.png"
  myimages[2]="christmas_sweater_GENERATOR_files/eiffel_tower_christmas_sweater.png"
  myimages[3]="christmas_sweater_GENERATOR_files/kitty_litter_christmas_sweater.png"
myimages[4]="christmas_sweater_GENERATOR_files/spatula_christmas_sweater.png"

  <!--//specify corresponding links below
  var imagelinks=new Array()
  imagelinks[1]="#http://www.christmassweaterfun.com/christmas_sweater_GENERATOR"
  imagelinks[2]="#http://www.christmassweaterfun.com/christmas_sweater_GENERATOR"
  imagelinks[3]="#http://www.christmassweaterfun.com/christmas_sweater_GENERATOR"
imagelinks[4]="#http://www.christmassweaterfun.com/christmas_sweater_GENERATOR"
-->

  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>

<!--the HTML:


<a href="#" onclick="function gif_animation(); function random_imglink();">
<img src="christmas_sweater_GENERATOR_files/christmas_sweater_generator-on-off.gif" width="100" height="200" alt="on-off" /></a>