Hacktime

Que seria de la web sin este blog

Detectar navegador con CSS

Posted by yaju en mayo 31, 2007

El siguiente truco esta basado en una de las características de Internet Explorer que es el no aceptar los comentarios formados por doble barra (//), por lo que cualquier cosa seguida por // lo entenderá como parte del código. Por ejemplo:

// display: hidden;

Firefox lo tomará como comentario y no ejecutará e IE lo tomará como código y lo ejecutará. De esta manera, podemos mostrar diferentes cosas dependiendo del navegador. Por ejemplo, en este caso, el rectángulo inferior será rojo si no se usa Internet Explorer y verde si lo es.

El CSS necesario es la siguiente:

#nonie, #iebased { margin: auto; margin-top: 20px; width: 400px; padding: 10px;
background-color: #f8e6e6; border: 1px solid #d2a2a2;
//background-color: #dbecd3; //border: 1px solid #b1d2a2; }

#nonie { //display: none; }

#iebased { display: none; //display: visible; }

Y estos los dos DIVs que se obtendrían dependiendo del navegador:

<div id="nonie">No estás utilizando Internet Explorer.</div>

<div id="iebased">Estás utilizando Internet Explorer.</div>

Para colocarlo como widget en Blogger, debemos colocar el CSS antes de ]]></b:skin>

Y colocar codigo de los DIVs en:

Plantilla–Elementos de la Pagina–HTML/JavaScript

Guardamos los cambios y listo😉

Via: Vagabundia

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

 
A %d blogueros les gusta esto: