IE 5.0 - Transparent Png Sorun Çözümü (js) - SPAKSU™ Blog [fdx-switch-link]

IE 5.0 – Transparent Png Sorun Çözümü (js)

Bilginiz üzre internet explorer 5 ve 6 sürümlerinde transparan png gösterim problemi vardır. Bunu epey bir araştırdım bulduklarımın bazıları sayfaları aşırı derecede kasan kodlardı. en sonunda güzel bir kod yapısını buldum ve sizinle paylaşmak istedim.

Sayfanıza eklemeniz gereken script kodu:

HTML-Kodu:

<script src="pngfix.js" type="text/javascript"></script>

ve JS kodu :

function correctPNG() // correctly handle PNG transparency in Win IE 5.5 or higher.
{
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
var imgAttribs = img.attributes;
for (var j=0; j<imgAttribs.length; j++)
{
var imgAttrib = imgAttribs[j];
if (imgAttrib.nodeName == "align")
{
if (imgAttrib.nodeValue == "left") imgStyle = "float:left;" + imgStyle
if (imgAttrib.nodeValue == "right") imgStyle = "float:right;" + imgStyle
break
}
}
var strNewHTML = "<span " + imgID + imgClass + imgTitle
strNewHTML += " style="" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
strNewHTML += "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
strNewHTML += "(src='" + img.src + "', sizingMethod='scale');"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}
window.attachEvent("onload", correctPNG);

Kodu linkte ziplenmiş .js uzantılı olarak bulabilirsiniz… bunu html klasörünüzle aynı yere açılmış olarak atmalısınız.
RapidShare: 1-Click Webhosting

2 yorumlar On IE 5.0 – Transparent Png Sorun Çözümü (js)

Bi Yanıt Bırak:

E-posta hesabınız yayınlanmayacak.

© 2006-2018 Tüm hakları Spaksu Blog'a aittir.

Kullanım Şartları yerine getirilmeden hiçbir şekilde kopyala - yapıştır yapılamaz, yazılar ve bilgiler kullanılamaz.