juillet
2007
Un article de Shugo78
Introduction :
Il y a peu de temps je vais sur un site où tout d’un coup on m’identifie mon navigateur 8O, j’écris donc a l’administrateur de ce site pour savoir comment faire et il se trouve que c’est du javascript, je vous livre donc cette recette sercète ;).
Comment identifier le navigateur web du visiteur ?
C’est donc javascript qui nous permet de faire cela… En effet la propriété Window.navigator se référe à un objet Navigator qui contient des informations sur le navigateur Web. L’objet navigator a 5 propriétées principales qui permettent de récupérer des informations sur le navigateur Web utilisé :
– appName : permet en théorie de récupérer le nom du navigateur utilisé ; ceci retourne « Microsoft internet Explorer » ou « Netscape ». Attention cependant certains navigateur comme Opéra peuvent passer pour d’autre selon leurs réglages. Pour firefox appName retourne également « Netscape ». Pour plus de précision il faut utiliser userAgent.
– appversion : permet de préciser le numéro de version(entre nous, je ne vois pas bien à quoi ça sert mais bon :P).
– userAgent : celui-ci c’est le plus important, c’est une chaine qui est renvoyé dans l’entête HTTP USER-AGENT. Cela permet de s’assurer de la justesse de la valeur de appName ou de appVersion.
– appCodeName : retourne le nom de code du navigateur(par exemple pour firefox c’est : mozilla, amusant ;)).
– plateform : retourne la plate-forme sur laquelle tourne le navigateur(win32, linux, i686, etc…).
Exemples :
Vous pouvez par exemple afficher à l’ecran le nom du navigateur comme ça :
document.write("<b>Votre navigateur est : <b>"+ navigator.appName);
</script>
Mais c’est plus marrant d’afficher ça sous forme de petite fenêtre :
alert(navigator.appName);
</script>
Au final l’idéal et d’orienter le visiteur vers tel ou tel page selon son navigateur :
var nomnav = navigator.appName;
if (nomnav == 'Microsoft Internet Explorer')
{
document.write("<link rel=\"stylesheet\" media=\"screen\" type=\"text/css\" href=\"style_ie.css\" />");
}
eles
{
document.write("<link rel=\"stylesheet\" media=\"screen\" type=\"text/css\" href=\"style_ff.css\" />");
}
</script>
Ce script est à positionner dans l’entête(balise <head>) de la page, il oriente l’utilisateur sur deux feuilles de styles selon son navigateur.
Conclusion :
Pensez à remercier Christian Lagnivof pour cette superbe recette ;). C’est amusant pour impressioner son entourage ou ses copains, de plus ce n’est pas très dur. Mais n’oubliez pas les utilisateurs qui ont désactivé javascript, alors prévoyez toujours une solution de rechange 