Tarayıcıya Özel Kod Yazmak

Geçenlerde bir web sayfasının kodlamasında karşılaştığım bir sorun yüzünden telaşına düştüğüm için bu yazıyı hazırlamaya karar verdim. Sorunum şöyleydi. Hazırlamış olduğum gelişmiş yapılı bir menü Firefox, Chrome ve Internet Explorer’da sorunsuz çalışırken Opera’da aşağıya kaymış görünüyordu. Kısa bir araştırma sonrasında ihtiyacım olan ufak bir uygulamayla karşılaştım.

[468×15]

 

Sorunun Çözümü

Rafael Lima tarafından yazılmış olan bu ufak boyutlu uygulama sayesinde aşağıda listelemiş olduğum web tarayıcılarına özel olarak CSS kodumuzu yazabiliyoruz.

Kurulum & Kullanım

Kullanımı oldukça basit. Yapmanız gereken şey aşağıdaki kodu web sayfanızın head etiketinden önce eklemek ve CSS dökümanınızda hangi tarayıcı için CSS yazacağınızı belirtmek.

[php]<script src="css_browser_selector.js" type="text/javascript"></script>[/php]

CSS Dökümanı içinde kullanmak

[php]

html.gecko div#logo {margin: 10px;}
.opera #logo {margin: 1.2em;}
.ie .logo {font-weight: bold;}
.mac.ie .logo {font-weight: bold;}
.[os].[browser] .logo {font-weight: bold;} /* .[os] ile .[browser] arasında boşluk yok */[/php]

Kullanılabilir Tarayıcı Kodları

[php]

ie – Internet Explorer (Tüm Sürümler)
ie8 – Internet Explorer 8.x
ie7 – Internet Explorer 7.x
ie6 – Internet Explorer 6.x
ie5 – Internet Explorer 5.x
gecko – Mozilla, Firefox (Tüm Sürümler), Camino
ff2 – Firefox 2
ff3 – Firefox 3
ff3_5 – Firefox 3.5
opera – Opera (Tüm Sürümler)
opera8 – Opera 8.x
opera9 – Opera 9.x
opera10 – Opera 10.x
konqueror – Konqueror
webkit ya da safari – Safari, NetNewsWire, OmniWeb, Shiira, Chrome, safari3 – Safari 3.x
chrome – Chrome
iron – SRWare Iron[/php]

Uygulamayı İndir

[download id=”14″]