Detectar el navegador de tus visitas con CSS

Este truco está basado en una de las características de IExplorer ya que este navegador interpreta los comentarios precedidos de doble barra, por lo que cualquier cosa seguida por // lo entenderá como parte del código.
He construido unas líneas de CSS para que cuando un usuario del blog llegue a nuestra página usando IExplorer, se muestre un mensaje que le dice que está usando IE, animándole además a cambiarse a Firefox. Si nuestra visita no está usando IExplorer, mostrará un mensaje distinto que le felicitará por su decisión de no usar IExplorer.
Por descontado que respeto a todas mis visitas por igual, usen un navegador u otro, esto no es más que un ejemplo para que se entienda el funcionamiento.

Este es el código CSS, donde podemos hacer las modificaciones que estimemos oportunas, color de fondo, del borde, tamaño del mensaje, margenes, etc.
Recordad que todo lo que esté precedido por la doble barra (//) será interpretado por IExplorer.

#otros, #paraie{
margin: auto;
margin-top: 20px;
width: 450px;
padding: 0 0 0 20px;
background-color: #efeff7;
border: 1px solid #a6c4e1;
//background-color: #ffffcc;
//border: 1px solid #cc0000;
}

#otros{
//display: none;
}

#paraie{
display: none;
//display: block;
}

Y esto es lo que colocaremos en el elemento HTMLJavascript o donde queramos mostrar el efecto. Dentro de las etiquetas div's se puede poner cualquier cosa que se desee mostrar(imagen, texto, publicidad), yo he añadido unos iconos que obtuve en Iconlet y un enlace para descargar Firefox:
<div id="otros"> Tu no estas utilizando Internet Explorer.... ¡Bien por ti!.... <img src="http://img99.imageshack.us/img99/3091/facewinkwo5.png"/></div>
<div id="paraie"> Tu estas utilizando Internet Explorer....¡Mejor con Firefox!.... <a href="http://www.difundefirefox.com/descargar-mozilla-firefox-gratis"><img src="http://img99.imageshack.us/img99/313/firefoxsd7.png"/></a></div>

Con IExplorer:

Con IE
Con otro navegador:

Con otros navegadores

0 comentarios:

Publicar un comentario