javascript code doesn't work in firefox

dinkado 0 255 Views

The code works perfect in IE but I can't get it to work in Firefox. Is there a work around for firefox?
Your time and help are greatly appreciated.
dinkado

<script language="JavaScript">




//put your text here
var theText = "This is test text";

function nextSize(i,incMethod,textLength)
{
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
}

function sizeCycle(text,method,dis)
{
	output = "";
	for (i = 0; i < text.length; i++)
	{
		size = parseInt(nextSize(i +dis,method,text.length));
		output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
	}
	theDiv.innerHTML = output;
}

function doWave(n) 
{   
	sizeCycle(theText,1,n);
	if (n > theText.length) {n=0}
	setTimeout("doWave(" + (n+1) + ")", 50);
}
</script>
<div ID="theDiv" align="center">

</div>


<body onload="doWave(0)">
Member Avatar for fxm
fxm 23 Posting Pro

Works fine here (once the elements are assembled into a page in the proper order).

Member Avatar for scrappedcola
scrappedcola 11 Posting Whiz in Training

Properly formed HTML is your friend in FF IE won't necessarily care.
Try:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
	<script language="JavaScript">
 //put your text here
var theText = "This is test text";
 
function nextSize(i,incMethod,textLength)
{
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
}
 
function sizeCycle(text,method,dis)
{
	var theDiv = document.getElementById("theDiv");
	output = "";
	for (i = 0; i < text.length; i++)
	{
		size = parseInt(nextSize(i +dis,method,text.length));
		output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
	}
	theDiv.innerHTML = output;
}
 
function doWave(n) 
{   
	sizeCycle(theText,1,n);
	if (n > theText.length) {n=0}
	setTimeout("doWave(" + (n+1) + ")", 50);
}
</script>
</head>
 
 
<body onload="doWave(0)">
<div ID="theDiv" align="center">
 
</div>
</body>
</html>

Also note the code I have highlighted. You didn't have a variable assigned to the Div element so it wasn't working for me in FF. Could have been a typo from when you posted but it would cause issues.

Member Avatar for dinkado
dinkado 0 Newbie Poster

Thanks so much scrappedcola!! It works like a charm now.
dinkado

Member Avatar for fxm
fxm 23 Posting Pro

FWIW: with this DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Firefox will be in 'quirks mode', so this function exactly as originally posted

function sizeCycle(text,method,dis)
{
	output = "";
	for (i = 0; i < text.length; i++)
	{
		size = parseInt(nextSize(i +dis,method,text.length));
		output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
	}
	theDiv.innerHTML = output;
}

works as intended.

Edited by fxm because: n/a
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Edit Preview