IE Transparan PNG Sorunu

irfaN | İnternet | Thursday, June 14th, 2007

Bu sorun, daha öncedende web geliştiren hemen hemen herkesin başından geçmiştir. Geri kalmış Internet Explorer PNG dosyalarını (PNG nin özgür olması nedeniyle midir bilinmez) tam olarak desteklemiyor. Safari, Mozilla, Fireox gibi bir çok tarayıcı 24 bit transparan PNG dosyasını olduğu gibi gösterme yeteneğine sahipken, M$ Internet Explorer zemine grilik atıyor.

Elimizdeki resim 150 x 150 px ebadında, 24 bit transparan zemine sahip bir PNG dosyası olsun. CSS dosyamıza #hucre isminde bir CSS id tanımlayalım ve kodumuzu yazalım;

1
2
3
4
5
6
#hucre {
width:150px;
height:150px;
background: transparent url(image.png) !important; background: transparent;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true , sizingMethod=scale src='image.png');
}

Artık Internet Explorer de PNG dosyamızı transparan bir şekilde tanıycaktır. Ben bu şekilde sorun yaşamadım. Hala sorununuz devam ediyorsa aşağıdaki satırları da CSS dosyanıza eklemenizde fayda var.

1
2
3
4
* html #hucre a {
position: relative; }
*+html #hucre a {
position: relative; }

10 Comments »

  1. Teşekkürler hocam çok faydalı bir bilgi oldu bu.

    Comment by Mehmet KURT — 05/09/2007 @ 00:00

  2. Denedim fakat bu zannediyorum İE 6.0 da geçerli değil. Benmi yapamadım acaba arkadaşlar deneyen varmı?

    Comment by wmwebtr ödüllü seo yarışması — 22/11/2007 @ 00:00

  3. Hayır, IE 6 serisinde geçerli. Bir çok yerde kullandım, sorun yapmadı. CSS kullanmasını biliyormusunuz ? Nasıl uyguladınızda çalışmadı ?

    Comment by irfaN — 24/11/2007 @ 00:00

  4. @erdem

    Uyguladığın dosyanın adresini verirsen bir göz atalım. Bu satırların siteyi kilitlemesi gibi birşey söz konusu değildir. Kullandığınız IE ile alakalı, veya bilgisayarınız ile alakalı bir problem yaşıyor olabilirsin.

    Comment by irfaN — 13/12/2007 @ 00:00

  5. denedim. ana gövdeye yerleştirdim transparan bg kullanıyordum. fakat yerleştirdikten sonra bu kodları css içine bu class la tanımlanan div ler içinde bulunan hiç bir şeye tıklayamaz olduk :D kitledi siteyi :D :D:D

    Comment by erdem — 13/12/2007 @ 00:00

  6. Çok çok çok teşekkür ederim…

    Comment by Doğukan — 02/04/2008 @ 00:00

  7. Hocam verdiğiniz bilgiler için çok teşekkür ederim çok işime yaradı. Birşey soracağım yapamadığım bi kısım; ‘background a bir görsel verdim ve bunu çok büyük gösteriyor, background-repeat:repeat-x de çalışmıyor. yardımcı olursanız çok seviniim İrfan bey

    Comment by Soner Uğraşkan — 25/08/2008 @ 00:00

  8. @Soner
    2 gün önce yeni bi eklenti bulmuştum, yazmayı düşünüyordum zaten, sende sorun yaşayınca üstüne geldi yazıverdim.
    http://blog.irfandurmus.com/ie-png-problemi/

    Comment by irfaN — 26/08/2008 @ 00:00

  9. [...] önce IE Transparan PNG Sorunu’ndan bahsetmiştik. Burada üst üste kullanımlarda ve background scale sorunu gibi sorunlar [...]

    Pingback by irfaN » Blog Archive » IE PNG problemi - Design, Development, Climbing, Life — 06/01/2009 @ 10:52

  10. s.a kardeş verdiğin bu png ile ilgili trasnperent resimler sorununun çözumu çok işime yaradı fakat benim bir sorunum daha var ben transperent olarak bir gif yaptımtarayıcıda oda sıkıntılı olyor onun nasıl çözulebiliceğinden yardımcı olabilirmsini?

    Comment by mehmet — 28/06/2010 @ 12:04

RSS feed for comments on this post. TrackBack URI

Leave a comment

Cekirdek; WordPress | Gorsel; Roy Tanck | Ev Sponsoru - Hosting degil! bildigin ev - ; SnefeRu