JavaScript – Preusmeravanje na odgovarajući CSS stil

Kao što smo rekli u prethodnom prilogu, da bi vaše web stranice izgledale konzistentno u svim browser-ima, trebalo bi da pripremite odgovarajuće CSS fajlove i izvršite preusmeravanje browser-a na odgovarajući stil. Ovo je pogotovo bitno kod veličine fontova. Zato ćemo kreirati rutinu za detekciju čitača, koja će potom u odnosu na rezultat usmeriti browser na odgovarajući spoljni CSS fajl. Pošto većina posetilaca nema poslednje verzije popularnih čitača, potrebno je napraviti i posebne stilove za različite verzije istog browser-a, kojim ćemo prebroditi limite starijih verzija.

Koristeći JavaScript moguće je proveriti „dolazeći“ browser i zatim ga preusmeriti na korišćenje određenog eksternog CSS skupa stilova, korišćenjem <LINK> taga. Evo i samog koda:


<html>
<head>
<title>CSS redirekcija</title>
<script language="£avaScript">
var IE4 = (document.all && !document.getElementById) ? true : false;
var IE5 = (document.all && document.getElementById) ? true : false;
var NS4 = (document.layers) ? true : false;
var NS6 = (document.getElementById && !document.all) ? true : false;
if (IE4)
document.write(‘<link rel="stylesheet" type="text/css" href="ie4.css">’);
else {
if (IE5)
document.write(‘<link rel="stylesheet" type="text/css" href="ie5.css">’);
else
if (NS4)
document.write(‘<link rel="stylesheet" type="text/css" href="ns4.css">’);
else
if (NS6)
document.write(‘<link rel="stylesheet" type="text/css" href="ns6.css">’);
}
</script>
</head>
<body>
Probna Web stranica.
</body>
</html>

U prve četiri linije vršimo detekciju browser-a korišćenjem provere specifičnih objekata za svaku vrstu browser-a, a potom rezultate smeštamo u odgovarajuće varijable. Sa gledišta JavaScript-a, osnovna razlika između Internet Explorer-a 4.x i 5.x je ta što verzija 4.x podržava objekat document.all, a ne podržava document.getElementById. Slično ovome, Netscape Navigator 4.x podržava objekat document.layers, a verzija 6.0 poseduje novi metod nazvan document.getElementById. Za razliku od Internet Explorer-a, NN 6.0 ne podržava objekat document.all.

Pratite Krstaricu na www.krstarica.com