SORU
21 Temmuz 2009, Salı


jquery döngüsü 7 İÇİN şeffaf png sorunu

Sorun jquery döngüsü şeffaf png dosyaları aldığımda 7 çalışmak için yaşıyorum

Ama IE (sürüm 7) siyah bir renk olsun Firefox Chrome iyi yer orası png şeffaflık fade sırasında.

Bu iş için yapılmış olabilir?

CEVAP
21 Temmuz 2009, Salı


7 şeffaf destekler ama ne yazık ki, PNG, tek bir filtre, bir kerede bir öğeye uygulanabilir.

Uygulamanız ne oluyor 7 PNG için alfa filtre uyguluyor ve sonra jQuery ile fade için başka bir alfa filtre uygulamak için davet ediliyor. Bu söylediğin gibi görünür sonuçları vardır.

Bunu aşmanın yolu bir kap içine png yuvana ve konteyner solmaya sonra. Sıralama böyle:

<div id="fadeMe">
    <img src="transparent.png" alt="" />
</div>

Bu etrafında almak için başka bir yol yapısını değiştiremem çünkü kullandığım bu basit jQuery eklentisi. Atıf verirdim ama gerçekten cant nerede bulduğumu hatırlıyorum.

/* IE PNG fix multiple filters */
(function ($) {
    if (!$) return;
    $.fn.extend({
    	fixPNG: function(sizingMethod, forceBG) {
    		if (!($.browser.msie)) return this;
    		var emptyimg = "empty.gif"; //Path to empty 1x1px GIF goes here
    		sizingMethod = sizingMethod || "scale"; //sizingMethod, defaults to scale (matches image dimensions)
    		this.each(function() {
    			var isImg = (forceBG) ? false : jQuery.nodeName(this, "img"),
    				imgname = (isImg) ? this.src : this.currentStyle.backgroundImage,
    				src = (isImg) ? imgname : imgname.substring(5,imgname.length-2);
    			this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"   src   "', sizingMethod='"   sizingMethod   "')";
    			if (isImg) this.src = emptyimg;
    			else this.style.backgroundImage = "url("   emptyimg   ")";
    		});
    		return this;
    	}
    });
})(jQuery);

NOTAslında eklenti IE6 PNG şeffaflık düzeltmek için yazıldı ama IE6 sorunu ile çalışmak için değiştirilmiş .

Not: İ aklımdan ama IE8 aynı sorun var sanırım üst kapalı hatırlıyorum. Eğer yanlışsam beni düzeltin :)

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Canceriansoul

    Canceriansou

    15 Ocak 2011
  • NCIX Tech Tips

    NCIX Tech Ti

    2 Ocak 2007
  • Ryan Ha

    Ryan Ha

    9 NİSAN 2006