[FONT=Arial]I made a scale animation that works on IE 7 but it does not work on Firefox 3.[/FONT]
[FONT=Arial]The button toggles between scaling up and down. [/FONT]
[FONT=Arial]In Firefox, it starts the loop for scaling up but it is quickly interrupted and return to its original scale.[/FONT]
[FONT=Arial]What should I change in the below code to make it also functional on Firefox 3 ?[/FONT]
[COLOR=blue][FONT=Arial]<head>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]<script language=“javascript”>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]var obj = null;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]var toggle = 0;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]var w = 55;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]var h = 40;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]var w_speed = 22;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]var h_speed = 16;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]function init()[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]{[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]obj = document.getElementById(“vase”).style;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]obj.width = 55 + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]obj.height = 40 + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]}[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]function ChangeScale()[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]{[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] if(toggle == 0)[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] {[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] w += w_speed;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] h += h_speed;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] obj.width = w + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] obj.height = h + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] if(w < 550) setTimeout(“ChangeScale()”,1);[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] else [/FONT][/COLOR]
[COLOR=blue][FONT=Arial] {[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] obj.width = 550 + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] obj.height = 400 + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] toggle = 1;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] return;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] }[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] }[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] else [/FONT][/COLOR]
[COLOR=blue][FONT=Arial] if(toggle == 1)[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] {[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] w -= w_speed;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] h -= h_speed;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] obj.width = w + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] obj.height = h + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] if(w > 55) setTimeout(“ChangeScale()”,1);[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] else [/FONT][/COLOR]
[COLOR=blue][FONT=Arial] {[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] obj.width = 55 + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] obj.height = 40 + “px”;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] toggle = 0;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] return;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] }[/FONT][/COLOR]
[COLOR=blue][FONT=Arial] }[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]}[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]window.onload = init;[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]</script>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]</head>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]<body bgcolor="#ffffff" background=“pattern_flowers.jpg” >[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]<div style=“position:absolute; top:240px; left:90px;”>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]<a href="" onClick=“ChangeScale()”><img id=“button” src=“Button.jpg”></img></a>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]</div>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]<div style=“position:absolute; top:20px; left:400px;”>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]<img id=“vase” src=“Vase.jpg”></img>[/FONT][/COLOR]
[COLOR=blue][FONT=Arial]</div>[/FONT][/COLOR]
[FONT=Arial]</body>[/FONT]
[FONT=Arial]</html>[/FONT]
