View Full Version : PNGfix + image swap = world of pain

06-01-2004, 07:22 PM
The subject-line says it all really.

I'm doing a few pages that use transparent PNGs, and in order for them to work with IE I'm using the pngfix.js script (found here: http://homepage.ntlworld.com/bobosola/pnghowto.htm )

Unfortunately, I also need to do onClick-triggered image swaps on these images, and when I try it I get "document.myimagename is NULL or not an object". I don't know much javascript but the pngfix script seems to be converting the <image>s to <span>s.

I don't know a great deal about javascript, so I'd *seriously* appreciate some pointers on what I should be doing.

Thanks in advance.

PS: I'm currently using an image with an empty link (no href=) to trigger the onClick, is this a valid thing to do? IE and Opera don't seem to mind, but I thought I'd better check.

06-01-2004, 07:32 PM
if my spidey senses are correct (wow i'm a dork...) you're trying to do something like what i recently needed to do.

this might help you

06-01-2004, 08:37 PM
Cheers canadianjameson, that was indeed what I needed to know. Not that my solution is very pretty:

function PNG_swap( element_id, image_name )
var element = document.getElementById( element_id );
var filter = element.style.filter;
var src_start = filter.indexOf( "(src='" );
src_start += 6;
src_end = filter.indexOf( "'," );
left = filter.substring( 0, src_start );
right = filter.substring( src_end );
element.style.filter = left + image_name + right;


Followup question - I know how to conditionally include this function for IE:

<!--[if gte IE 5.5000]>
(blah blah blah)

How do I do an 'else' so that sane browsers get to see the regular PNG_swap() function?

Edit: Never mind, I'm now checking the element.nodeName to determine if it's a span (IE+PNGfix) or an img (proper browser).