The Most Active and Friendliest
Affiliate Marketing Community Online!

“Adavice”/  “1Win

PNG Or Gif?

espmartin

New Member
affiliate
With IE6 and lower, transparent PNGs will not render properly. There
are javascript solutions that can call Microsoft proprietary code to
render the transparencies, but I was thinking...why not just use Gif's
for < IE6?
 
Yea. I've heard that. But, not experienced so far. Since IE is the browser of maximum % population, we gotta use .gif to display images properly
 
I hate using gif because of the issues with transparency and the invevitable loss of quality over jpeg.

png does still seem to be the way forward though.

And whatever happened to Jpeg 2000? :search:
 
I'm all for pngs, most sites I make have jquery in them any way so I use the jquery png fix for IE - works a charm!
 
I understand the arguement for pngs but I still prefer gif, must be habbit rather than common sense :(
 
PNG. Just don't make them transparent. Match the background colour if the browser doesn't support transparent-PNGs.
 
I'm all for pngs, most sites I make have jquery in them any way so I use the jquery png fix for IE - works a charm!

er, just a word to the wise here:

the png fix works on the basis of creating a blank element over the original image, getting the src file and setting it as a background, then applying some microsoft DirectX transform filters. essentially, you get a brand new object.

this will fail for you if you attach events to the image or reference it by ID.

for example (excuse my crude jquery, i like mootools):
HTML:
<img src="search.png" id="goSearch" />

<script>
$("goSearch").click(function(){
       // do something like ajax request
});

$("goSearch").pngFix(); 
</script>
http://jquery.andreaseberhard.de/pngFix/jquery.pngFix.js

well, clicking won't do anything anymore. is the source, it won't copy the click event, what's more, it will leave the old element with the old id (if it has one) within the dom (just hidden) -- you end up with 2 elements with the same id (crap).

basically, there are ways to clone events and whatever needed also (i have done a lot of testing) but it is not a reliable fix. if you do anything more fancy with your pngs, you are better off using .gif (for instance, having data-structures as per html 5, eg, data-tooltip="this is a cool image" won't get copied)

p.s. there are lots more attempts to fix pngs available (standalone or frameworked), just look for pngfix on google.
 
go for png and use a pngfix for ie6 or gif images including conditional comments..... png images have a higher quality
 
banners
Back