js stopped working in FF4 and FF5, Safari5.1

[Bumper]

here's the URL: http://www.rabradbury.com/furntesting.html

When mouseover on the small images at the base of the page, different text(s) and image(s) should
appear above in the different tds. For some reason it's displaying everything despite the span and "hide".
It worked fine in earlier browser versions. It's an old site (and I know it needs an upgrade) but it's a pro bono job for a senior who still works with his hands, and I work on it when I get a chance. This came as a surprise.

I'm stuck after hours of trying to figure it out. Worked fine before FF4.

THANKS in advance for any assistance.

<script type="text/javascript" language="JavaScript">
<!--

// show and hide spans
// Based on "Let Them Eat Cake" code from alistapart.com

function hideSpans(exempt) {
if (!document.getElementsByTagName) {
return null;
}
if (!exempt) exempt = "";
var spans = document.getElementsByTagName("span");
for (var i = 0; i < spans.length; i++)
{
var span = spans[i];
var id = span.id;
if (id != exempt) {
span.className = "hidden";
}
else {
span.className = "shown";
}
}
}

//Start of rolloverimages

function roll(img_name1, img_src1, img_name2, img_src2, img_name3, img_src3, img_name4, img_src4)
{
document[img_name1].src = img_src1;
document[img_name2].src = img_src2;
document[img_name3].src = img_src3;
document[img_name4].src = img_src4;
}

//-->
</script>

[jscheuer1]

Works OK here in Firefox 5. Perhaps you have javascript disabled in your browser.

[JShor]

It's working in Firefox, Chrome, Safari and Opera.

Internet Explorer is throwing errors and stopping the script because document[...] is undefined. If you remove the function roll() entirely (which appears to be irrelevant anyway), it should work fine in IE as well.



<script type="text/javascript" language="JavaScript">
<!--

// show and hide spans
// Based on "Let Them Eat Cake" code from alistapart.com

function hideSpans(exempt) {
if (!document.getElementsByTagName) {
return null;
}
if (!exempt) exempt = "";
var spans = document.getElementsByTagName("span");
for (var i = 0; i < spans.length; i++)
{
var span = spans[i];
var id = span.id;
if (id != exempt) {
span.className = "hidden";
}
else {
span.className = "shown";
}
}
}

//Start of rolloverimages

function roll(img_name1, img_src1, img_name2, img_src2, img_name3, img_src3, img_name4, img_src4)
{
// Remove
}

//-->
</script>