transparent png rollover problems

[lotsofno]

I have a beta test page here: http://www.inthegray.com/beta/index.htm

I'm using some javascript I got from here (http://www.alistapart.com/stories/pngopacity/) (a list apart) and here (http://oaksanderson.com/opacity/examples/ex2.htm) (ala example) to do an image swap on mousever, and return on mouseout. The menu I applied it to is the "archives and fiction" images at the top right. Here's the slice of JS code I have in the head:

****

<script language="javascript" type="text/javascript"><!--
var flag = false;

function init() {
//image swapping - on-images
if (document.images) {
fictionon = new Image();
fictionon.src = "fiction_over"+strExt;
archiveson = new Image();
archiveson.src = "archives_over"+strExt;
mast = new Image();
mast.src = "mast_over"+strExt;
return (flag = true);
}
}

//image swapping - off-images
if (document.images) {
fictionoff = new Image();
fictionoff.src = "fiction"+strExt;
archivesoff = new Image();
archivesoff.src = "archives"+strExt;
mast = new Image();
mast.src = "mast"+strExt;
}

// --></script>

****

strExt, is PNG, from what I understand. Despite my best efforts, I can't get the swap to work properly, or at all. I've been able to get the background color to change on mouseover and change back out in IE, but not in Opera. I toyed around it a bit, and I think the image does swap back on mouseout (I've only seen it do this on Opera), but still doesn't swap on mouseover.

Any help would be MUCH MUCH appreciated. I've been working on this for hours now and need to move on. Thanks in advance...

[Exuro]

I think the problem is in the opacity.js file. Try changing everywhere it says document[strId] to document.getElementById(strId) and see if that helps.

[lotsofno]

I went ahead and did that with no results on either IE or Opera... :o(

Thanks for the suggestion, though.