RSS

ilgi alanlarým

son yorumlar

eþim dostum

IE PNG problemi

26 Aðustos 2008

CSS kategorisindeki tüm yazýlar
Daha önce IE Transparan PNG Sorunu'ndan bahsetmiþtik. Burada üst üste kullanýmlarda ve background scale sorunu gibi sorunlar vardý. TwinHelix yazdýðý bu iepngfix eklentisi ile neredeyse tüm sorunlarý ortadan kaldýrmýþ. Sorunlarý kaldýrmakla da kalmamýþ yeni özellikler bile eklemiþ. Sayfasýnda kullanýmý çok güzel anlatýlmýþ (ingilizce). Ben sayfanýn tamamýný çevirmek yerine nasýl kullanýlacaðýný anlatýyým.
. . . . . . . . . .
iepngfix.zip dosyasýný indirip açtýðýnýzda içerisinden bize gerekli dosyalar iepngfix.htc ve blank.gif. iepngfix.htc dosyasýnda düzenlememiz bir yer var. 15. satýrdaki þu kýsým :

if (typeof blankImg == 'undefined') var blankImg = 'blank.gif';

buradaki blank.gif kýsmýný, sizin blank.gif dosyasýnýn tam yolunu vermelisiniz. örneðin, /images/blank.gif gibi. Daha sonra eðer bir css dosyasý kullanýyorsanýz, css dosyasýnýn baþýna,

img.png, div.png { behavior: url(/css/iepngfix.htc) }

gibi bir satýr eklemelisiniz. burada img.png ve div.png tamamen örnek olarak yazýlmýþtýr, aþaðýda buraya geri döneceðiz. Tabii ki '/css/iepngfix.htc' kýsmýný da sitenize yüklediðiniz htc dosyasýnýn url si olmalý. Sayfanýza ekli bir css dosyanýz yoksa, html dosyasýnzýn </head> tagýndan hemen önce

<style type="text/css">
img.png, img.div { behavior: url(/css/iepngfix.htc) }
</style>

þeklinde kullanabilirsiniz. Evet þimdi img.png ve img.div kýsýmlarýný açýklayalým.
Burada transparan png kullanacaðýnýz id ve class larý yazmalýsýnýz.
örneðin;

img.png { behavior: url(iepngfix.htc) }

þeklinde css dosyanýza eklediniz, bir png transparan resmi çaðýrýrken

<img src="/images/header.png" alt="Header Image" width="248" height="47" border="0" class="png" />

yukarýda class="png" kýsmýna dikkat!
veya baþka bir örnek..

div#header { behavior: url(iepngfix.htc) }

þeklinde css dosyanýzýn içerisine yazdýnýz. HTML dosyanýzda transparan olmasýný istediðiniz png dosyasý, hangi id'ye background olarak tanýmladýysanýz, o div'in id'sini veya class'ýný vermelisiniz.

<div id="header">
# bu div'in arka plan görüntüsü transparan png dir.
</div>

Sitenizde kullandýðýnýz tüm resim dosyalarý .png ve transparan ise,

img { behavior: url(iepngfix.htc) }

þeklinde tüm img taglarýna bunu uygulayabilirsiniz.

Script GPL altýnda daðýtýlýyor. Yazan arkadaþ(lar)a geliþtirme, belgelendirme gibi yaptýðý hizmetler için dilerseniz bu adresten bir yemek ýsmarlayabilirsiniz.

Ýlgili Baðlantýlar :
iepngfix.zip
iepngfix.zip diðer yansý (güncellenmez)
IE PNG Fix Sayfasý
Online demo ve kullaným sayfasý
Baðýþ sayfasý

Thanks TwinHelix !
Bu yazý 179 kez okunmuþ, 1 adet yorum yapýlmýþ.
irfaN , 07 Eylül 2008 tarihinde yazmýþ:
Sonradan farkýna vardým, bu eklenti MultiIE ile denediðim ie6 da ciddi sorunlara yol açtý. Eðer png arka planý verdiðiniz html etiketinin içerisindeki yazýlarýn görünmemesi gibi problemler yaþýyorsanýz, daha önceki bahsettiðim http://irfandurmus.com/blog/oku/33/IE.Transparan.PNG.Sorunu adresindeki yöntemi deneyebilirsiniz.

Anlaþýlan bu sorunun heryerde kullanabileceðiniz kesin bir çözümü malesef yok. Ya insanlar IE kullanmaktan vazgeçecek, ya da biz iþkence çekmeye devam edecez.
Ýsim :

Web :
http://
E-Posta :
E-posta adresiniz hiç bir yerde yayýmlanmayacaktýr.
Yorum :