A Problem regarding Mozilla and Firefox

[bgwg80]

I wrote a javascript to scroll the contents inside of a span tag. I works with IE 6.0. But, When I tried it on mozilla and firefox. The browsers just halted(not responding). so, I had to kill those browsers' processes. My code is here:

function PbSpan(objId,step,delay)
{
//Properties
this.spanObj = document.getElementById(objId);
this.pixelSize = step;
this.intervalDelay = delay;
this.intervalId = 0;

//Pre-settings
this.spanObj.parentObj = this; //user-defined property for span object
this.spanObj.style.overflow = "hidden";
this.spanObj.innerHTML = "<table cellpadding=0 cellspacing=0 border=0 width=100>"+
"<tr><td>"+this.spanObj.innerHTML + "</td></tr>"+
"</table>";
this.spanObj.scrollTop=0;
while(this.spanObj.scrollHeight <
parseInt(this.spanObj.style.height)*2)
{
this.spanObj.innerHTML += this.spanObj.innerHTML;
}

//Start to play scrolling
this.intervalId =
setInterval(
'posCheck("'+this.spanObj.id+'");'+
'getObj("'+this.spanObj.id+'").scrollTop+='+this.pixelSize,
this.intervalDelay);

this.spanObj.onmouseover = mouseOverHandler;
this.spanObj.onmouseout = mouseOutHandler;
}

//Event Handlers
function mouseOverHandler()
{
clearInterval(this.parentObj.intervalId);
}

function mouseOutHandler()
{
this.parentObj.intervalId =
setInterval(
'posCheck("'+this.id+'");'+
'getObj("'+this.id+'").scrollTop+='+this.parentObj.pixelSize,
this.parentObj.intervalDelay);
}

//Required functions
function posCheck(str)
{
var obj = getObj(str);
if((parseInt(obj.style.height) + obj.scrollTop) >= obj.scrollHeight)
{
obj.scrollTop = parseInt(obj.style.height); // one pixel of mis-position expected.
}
}

function getObj(str)
{
return document.getElementById(str);
}

At least, the browsers should show an error message. they just stopped processing.

Thank you for reading this.

 

[BillyRayPreachersSon]

It's hard to test, as you haven't posted the relevant HTML to match the code. However, I'd like to bet that it's the while loop that is causing the problem:

while(this.spanObj.scrollHeight < parseInt(this.spanObj.style.height)*2)

You might want to add the extra parameter to all of your parseInt calls:

var foo = parseInt(bar, 10);

The ", 10" tells parseInt that you want to convert numbers to decimal. Without it, any numbers with a leading 0 will be treated as octal, I believe.

Whether that is the root cause of the while loop hanging (if indeed it is that) shall remain unknown for now, I guess... But it could also be that "this.spanObj.scrollHeight" is always less than "this.spanObj.style.height*2". I'd try putting the following line immediately inside the "while" loop:

window.status = 'While loop still running: ' + (this.spanObj.scrollHeight < parseInt(this.spanObj.style.height, 10)*2);

And look in the status bar to see if the while loop ever quits. If it doesn't I'd say you've found your culprit.

Incidentally, do you have a valid DOCTYPE at the top of your document? If not, try adding one.

Hope this helps,
Dan

 

[bgwg80]

Thank you for the note. As you mentioned, the problem was the while loop. somehow, firefox and mozilla returns the same value for both scrollHeight and height properties. So, as scrollHeight increases, height increases. the loop condition never becomes false. Thank you.