jpeg naar gif

[Gast]

Hmmm ... een kleine PNG hack voor IE? Pray tell <img src="/forums/images/graemlins/laugh.gif" alt="" />

[Duwgati]

Ik gebruik altijd de Bob Osola JS-methode:

Code:

 function correctPNG()    {   for(var i=0; i<document.images.length; i++)      {	  var img = document.images[i]	  var imgName = img.src.toUpperCase()	  if (imgName.substring(imgName.length-3, imgName.length) == "PNG")	     {		 var imgID = (img.id) ? "id='" + img.id + "' " : ""		 var imgClass = (img.className) ? "class='" + img.className + "' " : ""		 var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "		 var imgStyle = "display:inline-block;" + img.style.cssText 		 if (img.align == "left") imgStyle = "float:left;" + imgStyle		 if (img.align == "right") imgStyle = "float:right;" + imgStyle		 if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle				 var strNewHTML = "<span " + imgID + imgClass + imgTitle		 + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"	     + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"		 + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 		 img.outerHTML = strNewHTML		 i = i-1	     }      }   }window.attachEvent("onload", correctPNG); 

 

In mijn style sheet gebruik ik dan iets als:

Code:

 .op70 {	opacity: .7;	-moz-opacity: .7;	filter: alpha(opacity=70); }

 

En in de html gebruik je dan: class="op70"

 

Meer info van Microsoft:

http://msdn2.microsoft.com/en-us/library/ms532969.aspx

Heeft de nodige tekortkomingen dus kun je net zo goed overslaan <img src="/forums/images/graemlins/wink.gif" alt="" />

 

Hier wat links met keurige uitleg over alternatieve methoden:

http://www.alistapart.com/stories/pngopacity/ (zeer uitgebreide uitleg)

http://joggink.be/blog/wp-content/2006/12/png_class/# ("View Source" analyseren en JS-class downloaden)

 

En er is nog volop meer te vinden op het web, bijvoorbeeld als je een PNG met transparancy wilt gebruiken als background.