PNG Transparency and Javascript Problem

Hey, I am currently using the following code to fix the transparency problem in Internet Explorer

<!--[if lt IE 7.]>
<script defer type="text/javascript" 

src="http://www.freewebs.com/x2i4eva/pngfix.js"></script>
<![endif]-->

Code (markup):

However whenever I try to add styles or javascript - it fails to operate. For instance: <.. onClick="this.style.cssText = ''filter:xray">

It also does this with the style tag: <.. style="border: 1px solid #000000">



Anyone know why?

 

do you mean when you add styles/script to other portions of your page?

You may want to consider just embedding the script, here's how:
http://www.justin-cook.com/wp/2006/03/14/javascript-fix-png-transparency-in-ie-without-htc-file/

 

this doesnt seem to work. It just displays a smaller image without a transparent background and then a larger one with the transparency. Could you please give me an example code?

 

did you save the blank.gif to your image directory?

 

yep and instead it displayed the two images overlapped - one with and one without the transparency :S

 

actually i got it working now - thanx a lot for helping - much appreciated

 

new problem - I cant actually apply any styles or JS to the actual image, just the blank image.

Basically I want a transparent .png then when mouse is down on it, it gains a border and then loses it on mouseup. Then when clicked it opens a new page. Also I cannot resize the png using code - again only the blank image.

 

I don't think you can do that. I believe the JavaScript png fix actually replaces the image with the blank image, and then applies the png as a filter

so you may not be able to style the filtered image

 

Isnt there a way to determine at least the height and width of the filter before it is written?

 

Not that I'm aware of

 

well thanx anyway - i just resorted into resizing the actual images themselves instead lol.