This works fine in ie but in firefox all the three images change to the "out animation" onmouseout
Code:
CODE
if (document.images) {
a2alpha = new Image();
alpha2a = new Image();
a2alpha.src = "graphics/a2alpha.gif";
alpha2a.src = "graphics/alpha2a.gif";
}
else {
a2alpha.src = "";
alpha2a.src = "";
}
function animate(arrow) {
document.getElementById('arrow' + arrow).src = a2alpha.src;
}
function deanimate(arrow) {
document.getElementById('arrow' + arrow).src = alpha2a.src;
}
....
<img src="graphics/arrow.gif" class="arrow" id="arrow1" style="top: 201px;">
<img src="graphics/spacer.gif" class="boverlay" style="top: 190px;" onmouseover="active('1'); animate('1');" onmouseout="deactive('1'); deanimate('1');">
<img src="graphics/arrow.gif" class="arrow" id="arrow2" style="top: 273px;">
<img src="graphics/spacer.gif" class="boverlay" style="top: 262px;" onmouseover="active('2'); animate('2');" onmouseout="deactive('2'); deanimate('2');">
<img src="graphics/arrow.gif" class="arrow" id="arrow3" style="top: 345px;">
<img src="graphics/spacer.gif" class="boverlay" style="top: 334px;" onmouseover="active('3'); animate('3');" onmouseout="deactive('3'); deanimate('3');">
a2alpha = new Image();
alpha2a = new Image();
a2alpha.src = "graphics/a2alpha.gif";
alpha2a.src = "graphics/alpha2a.gif";
}
else {
a2alpha.src = "";
alpha2a.src = "";
}
function animate(arrow) {
document.getElementById('arrow' + arrow).src = a2alpha.src;
}
function deanimate(arrow) {
document.getElementById('arrow' + arrow).src = alpha2a.src;
}
....
<img src="graphics/arrow.gif" class="arrow" id="arrow1" style="top: 201px;">
<img src="graphics/spacer.gif" class="boverlay" style="top: 190px;" onmouseover="active('1'); animate('1');" onmouseout="deactive('1'); deanimate('1');">
<img src="graphics/arrow.gif" class="arrow" id="arrow2" style="top: 273px;">
<img src="graphics/spacer.gif" class="boverlay" style="top: 262px;" onmouseover="active('2'); animate('2');" onmouseout="deactive('2'); deanimate('2');">
<img src="graphics/arrow.gif" class="arrow" id="arrow3" style="top: 345px;">
<img src="graphics/spacer.gif" class="boverlay" style="top: 334px;" onmouseover="active('3'); animate('3');" onmouseout="deactive('3'); deanimate('3');">
I have noticed that, in firefox, it works fine the first time the function is called and the second time it then changes both the new "arrow" and the old one.
Is this a common firefox problem that i have missed?
All help is appreciated
Kvarnerexpress
