Detection du navigateur avec jQuery
Publié par Gui dans jQuery
Bien souvent, nous nous confrontons à des soucis d’inter-opérabilité entre certains navigateurs (IE pour ne pas le citer !). Les hacks CSS existent mais rendent la feuille de style non valide et altèrent la visibilité du code.
Un moyen simple et propre de contourner ces difficultés est de détecter le navigateur à l’aide de Javascript (jQuery en l’occurence).Ainsi grâce au plugin jQuery Browser, il est très facile de récupérer un objet javascript contenant les informations sur le navigateur (type, version, etc…), qui nous permettra d’effectuer différents traitements selon le navigateur de l’utilisateur.
alert($.browser.name); // Cela affichera 'firefox' alert($.browser.className) // firefox4
Encore mieux, il ajoute automatiquement des classes à la balise <HTML> pour facilement styliser de manière hiérarchique des éléments dont l’affichage diffère.
<html class="js win firefox firefox4 gecko gecko2">
Ainsi nous pouvons ajuster l’affichage pour différents navigateurs :
.chrome #monDiv{ background: red; }
.msie #monDiv{ background: blue; }
.safari #monDiv{ background: green; }
Informations et téléchargement ici: http://jquery.thewikies.com/browser/
Ces articles peuvent aussi vous intéresser :
4 commentaires
Laisser une réponse
Cool ce post, je cherchais justement à faire ça ! Merci
Merci pour cette découverte.
Dans la même veine : http://dev.neowebmag.com/php/detecter-navigateur-utilisateur
Pour info :
pour Android il affiche : Safari,
pour iPhone et iPad : Safari
Pas fait pour la détection de device donc =/
Haha
J’allais te contacter pour savoir si t’avais un moyen sympa pour détecter les navigateurs. Je cherche sur Google et je tombe sur ton blog. C’est beau, non ?