0

Cargar diferentes CSS según nuestro navegador

 

 

Una de las grandes desventajas a la hora de diseñar nuestra página es la compatibilidad destinada a cada navegador porque como bien sabemos cada navegador es un mundo y cada uno posee desarrollos distintos.

 

Bien con Internet Explorer podemos usar tags condicionales como alternativa para realizar una determinada acción como es en la carga de un css o aplicar reglas de estilo como vemos a continuación:

 


<!--[if IE]>

<link rel="stylesheet" type="text/css" href="all-ie.css" />

<code>&lt;![endif]--&gt;</code>

 

Pero a la hora de querer llevarlo más alla con otros navegadores como puede ser Firefox, Chrome, Opera o Safari entre muchos nos quedamos a cuadros, he aquí entonces la solución a tal engorro, si tenemos nuestra web creada en php.

 

Con la función getbrowser no tendremos problemas, sólo tenéis que copiar el código siguiente en vuestro archivo functions.php o el que tengáis vosotros por defecto:

 

function getBrowser()
{
$u_agent = $_SERVER['HTTP_USER_AGENT'];
$bname = 'Unknown';
$platform = 'Unknown';
$version= "";

// Next get the name of the useragent yes seperately and for good reason
if(preg_match('/MSIE/i',$u_agent) &amp;&amp; !preg_match('/Opera/i',$u_agent))
{
$bname = 'Internet Explorer';
$ub = "ie";
}
elseif(preg_match('/Firefox/i',$u_agent))
{
$bname = 'Mozilla Firefox';
$ub = "firefox";
}
elseif(preg_match('/Chrome/i',$u_agent))
{
$bname = 'Google Chrome';
$ub = "chrome";
}
elseif(preg_match('/Safari/i',$u_agent))
{
$bname = 'Apple Safari';
$ub = "chrome";
}
elseif(preg_match('/Opera/i',$u_agent))
{
$bname = 'Opera';
$ub = "opera";
}

return $ub;
}

 

Y luego en nuestro header hacemos la llamada justo antes de cargar las css:

 

&lt;?php $browser = getBrowser(); ?&gt;
&lt;link rel="stylesheet" href="&lt;?php echo bloginfo('stylesheet_directory') . '/' . $browser . '.css'; ?&gt;"" type="text/css" media="screen" /&gt;

 

La única desventaja posible es tener que tener atendido varias versiones de un mismo archivo para cada uno de ellos, si alguien conoce mejores métodos no dudéis en decirlo en la caja de comentarios.

 

Saludos.

Tone

Ingeniero del Software y procrastinador sin remedio, interesado en todo lo que tenga que ver con el mundo del desarrollo web y la inteligencia artificial, no sé si seré el responsable de la creación de Skynet algún día pero se intenta.

ESCRIBIR UN COMENTARIO
  • (will not be published)

XHTML: Puedes usar estas etiquetas: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>