Créer une feuille de style par navigateur

Pour pouvoir changer de feuilles de styles selon les navigateurs, il faut reconnaître à l’aide de javascript le nom du navigateur et la version du navigateur.

appName retourne le nom du navigateur.

appVersion retourne la version du navigateur sous la forme numéro de version ( plateforme (système d’exploitation), nationalité).

Sur une page version.html on peut détecter la version du navigateur de cette manière :

<script language="Javascript">       

<!-- 
document.write(appVersion.propriete);       

// -->       

</script>

Voici le code permettant de choisir une feuille par navigateur :

<script language="javascript"> 
      var navig = navigator.appName; 
      var version = navigator.appVersion; 
 if (version.search("MSIE 7.0") != -1 
&& navig.search("Microsoft")!=-1 ) 
   { 
   document.write("<link rel=\"stylesheet\" 
type=\"text/css\" media=\"screen\" 
href=\"screenie7.css\" />"); 
   document.write("<link rel=\"stylesheet\" 
 type=\"text/css\" media=\"print\" 
 href=\"printie7.css\" />");    
   }  
 else if ( version.search("MSIE 6.0")!=-1 
&& navig.search("Microsoft")!=-1  ) 
   { 
   document.write("<link rel=\"stylesheet\" 
 type=\"text/css\" media=\"screen\" 
href=\"screenie6.css\" />"); 
   document.write("<link rel=\"stylesheet\" 
type=\"text/css\" media=\"print\" 
 href=\"printie6.css\" />");    
   } 
 else if (  navig.search("Netscape")!=-1  ) 
   { 
   document.write("<link rel=\"stylesheet\" 
type=\"text/css\" media=\"screen\" 
 href=\"../assets/styles/screenfirefox2.css\" />"); 
   document.write("<link rel=\"stylesheet\" 
type=\"text/css\" media=\"print\" 
 href=\"printfirefox2.css\" />");    
   }    
 else if ( navig.search("Opera")!=-1  ) 
   { 
   document.write("<link rel=\"stylesheet\" 
 type=\"text/css\" media=\"screen\" 
 href=\"screenopera9.css\" />"); 
   document.write("<link rel=\"stylesheet\" 
 type=\"text/css\" media=\"print\" 
 href=\"printopera9.css\" />");    
   } else  
   { 
   document.write("<link rel=\"stylesheet\" 
type=\"text/css\" media=\"screen\" 
 href=\"firefox2.css\" />"); 
   document.write("<link rel=\"stylesheet\" 
type=\"text/css\" media=\"print\" 
 href=\"printfirefox2.css\" />"); } 
  
  </script> 
  

http://www.commentcamarche.net/javascript/jsnavigator.php3?imprim=1

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s

%d blogueurs aiment cette page :