Help me with this rollover

This site is best viewed in a modern browser with JavaScript enabled.

Herrjosua

I am trying to get this rollover with fade to work. I forget exactly where I copied the javascript from but it worked before I modifed it. Can anyone help me troubleshot this problem?
Thanks

Here is the code I have so far:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<html>

<head>

<title> Welcome to Howling Wolf Studios </title>

<HEAD>

<!-- Begin
var maximages = 10; // how many fade images do you have?
var fadespeed = 125; // fade frame time in milliseconds; 125 = 125 ms

var fadeintimer;
var fadeouttimer;
var fadeincount = 0;
var fadeoutcount = maximages-1;
var fadearray = new Array(maximages); // enter all the fade images here
// the first item should be 0, then numbered through 1 less than your maximages

fadearray[0] = "images/NewWolfLogo.jpg";
fadearray[1] = "images/NewWolfLogoFade00.jpg";
fadearray[2] = "images/NewWolfLogoFade01.jpg";
fadearray[3] = "images/NewWolfLogoFade02.jpg";
fadearray[4] = "images/NewWolfLogoFade03.jpg";
fadearray[5] = "images/NewWolfLogoFade04.jpg";
fadearray[6] = "images/NewWolfLogoFade05.jpg";
fadearray[7] = "images/NewWolfLogoFade06.jpg";
fadearray[8] = "images/NewWolfLogoFade07.jpg";
fadearray[9] = "images/NewWolfLogoFade08.jpg";
fadearray[10] = "images/NewWolfLogoFade09.jpg";

HaganeNoKokoro

you don't seem to have an image with id="fade-pic" anywhere, so the code is unable to find document.images["fade-pic"]

Herrjosua

So I would just need to rename the image "fade-pic" to my first image or my last image?
Thanks Again

HaganeNoKokoro

well, whichever img tag you want to change should have the name/id "fade-pic"

Herrjosua

Ok I have gotten the rollover to work. But it is showing the first and the last image in addition to the image with the rollover. Here is the code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<title> Welcome to Howling Wolf Studios </title>

<HEAD>

<!-- Begin
var maximages = 11; // how many fade images do you have?
var fadespeed = 125; // fade frame time in milliseconds; 125 = 125 ms

for (var i = 0; i < maximages; i++) {
eval('pic' + i + ' = new Image();');
eval('pic' + i + '.src = fadearray;'); // preloads fade images
}
function fade_in() {
clearTimeout(fadeouttimer);
document.images['HWSLogo'].src = fadearray[fadeincount];
if (fadeincount != maximages-1) {
fadeincount++;
fadeintimer = setTimeout('fade_in()', fadespeed);
}
else {
clearTimeout(fadeintimer);
fadeincount = 0;
}
}
function fade_out() {
clearTimeout(fadeintimer);
document.images['HWSLogo'].src = fadearray[fadeoutcount];
if (fadeoutcount != 0) {
fadeoutcount--;
fadeouttimer = setTimeout('fade_out()', fadespeed);
}
else {
clearTimeout(fadeouttimer);
fadeoutcount = maximages-1;
}
}
// End -->
</script>

</head> 

<body> 

<body bgcolor="#000000" text="FF0000"> 

 



<div align="center" 

Welcome to Howling Wolf Studios



</div>

 
<center>
<a href="mailto:jbock@howlingwolfstudios.net" onmouseover="fade_in()" onmouseout="fade_out()">

<img name="HWSLogo" height=457 width=445 border=0 src="images/NewWolfLogo.jpg"> 

</center>

<center>
Free JavaScripts provided 
by <a href="http://javascriptsource.com">The JavaScript Source</a>
</center>
 
 
 
 
 
 

 
 


 

This is my group project called Deadfall done in Alias' Maya. The assignment was to design a 30 second animation that flies around the capture the flag level we designed and built. I worked on everything on the red base minus the three gun turrents. To download the file right mouse click and hit "save target as".
 
 
<a href="images/deadfall.mov"> Click here to download Deadfall.</a>
 
 
This is my first project done in my Interactive Design Class. The assignment was to make an animation from the Shockwave Rider excerpt, which you can <A HREF="html/Shockwave.html "font size="+1" color="#FFFFFF" target="blank" > read here</a>. To download the file right mouse click and hit "save target as".
 
 
<a href="images/Shockwave.mov"> Click here to download the Shockwave Rider.</a>
 
 
 
Don't have Quicktime?
<a href="http://www.apple.com/quicktime/download/index.html"target="blank"> 
 
Download it here.</a>
 
<a href="http://www.apple.com/quicktime/download/index.html"><img src="images/getquicktime.gif" hspace="15" vspace="15" border="0" ></a>

 
 

<A HREF="mailto:jbock@howlingwolfstudios.net"> Contact Me</A>




</body>

</html>