Posted on 24 March 2010 by Abrahan Núñez
A veces existen CrossBrowsing un poco incómodos de manejar, para esos casos suelo crear una hoja de estilo específicamente para el navegador que esté presentando el problema. Aquí les dejo un código en Javascript que me ha solucionado este tipo de problema en varias ocasiones y resulta muy útil, básicamente lo que hace el código es detectar el la versión del navegador y luego asignar una hoja de estilo. En el ejemplo uso Firefox, pero regularmente utilizo esta solución para ie6, que en paz descanse :)
-
-
<script type="text/javascript">
-
if (/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent)){
-
var ffversion=new Number(RegExp.$1)
-
if (ffversion>=3)
-
document.write(‘<header><link rel="stylesheet" href="../css/firefox.css" type="text/css" /></header>’)
-
else if (ffversion>=2)
-
document.write("Usando Firefox 2.x :)")
-
else if (ffversion>=1)
-
document.write("Usando Firefox 1.x :)")
-
}
-
else
-
document.write("Usando otro navegador :)")
-
</script>
Posted on 24 February 2010 by Abrahan Núñez
Ahora que Internet Explorer esta en su version 8, nos sentimos un poquito mas seguro al momento de maquetar un website basado en CSS y XHTML, aunque explorer siempre se resiste a estar a la orden dia, por ejemplo, CSS ya esta por si version 3, CSS3 y aun explorer no esta renderizando totalmente todas las nuevas funciones de CSS3.
Pero en fin, este post no es para hablar tanto sobre IE, hoy lo que interesa es demostrar como podemos detectar si nuestros visitantes utilizan Internet Explorer 6 y como darle un aviso de alerta para que actualice su navegador o de lo contrario no podra disfrutar de todo el explendor del website, cabe destacar que no es una buena practica obligar a un visitante a que actualice, nosotros debemos de preparar todo para cualquier visitante.
En fin, no tenemos que usar JavaScript para saber si el visitante esta usando una version X de Internet Explorer , lo unico que tenemos que usar con comentarios condicionales para Internet Explorer:
-
-
<head>
-
<title> Mi titulo </title>
-
<!–[if lte IE 7]>
-
<style type="text/css" media="screen">
-
< ! @import "css/ie6.css"; –></style>
-
</head>
-
Aqui estamos tratando de saber si el navegador es una version menor que Internet Explorer 7 y si es asi importamos nuestro estilo para Internet Explorer 6, esto en la cabecera de nuestro HTML.
Ahora creamos nuestro mensaje de alerta:
-
-
<body>
-
<!–[if lte IE 7]>
-
<div id="alert">Usted necesita actualizar su navegador, o tratar con otro para poder disfrutar completamente de este website</div>
-
< ![endif]–>
-
</body>
-
Ahora miremos el codigo de nuestro archivo ie6.css:
-
-
#alert{
-
background-color:#F00;
-
color:#FFF;
-
font-size:90%;
-
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
-
height:25px;
-
margin-bottom:10px;
-
}
-
Tan sencillo como eso, si nuestro visitante tiene una version mayor, pues no hay problema, el mensaje no se desplegara.
Vía: Asinox.net
Posted on 08 January 2010 by Abrahan Núñez
Con unas simples líneas de código podemos agregar a nuestro proyecto web cosas realmente originales, en este caso la idea es cambiar nuestra hoja de estilo dependiendo de la hora del reloj. Es realmente simple, se basa en crear tres hojas de estilos diferentes, uno para la mañana, otro para la tarde y otro para la noche. Luego simplemente añadimos este código en nuestro encabezado o head:
Cambiamos esto:
-
<link rel=”stylesheet” type=”text/css” href=”miestilo.css” />
por esto:
-
<link rel=”stylesheet” type=”text/css” href=”
-
<?php
-
-
if ($hour <
12) echo “morning.css”;
-
elseif ($hour <
20) echo “day.css”;
-
else if ($hour <
4) echo “night.css”;
-
?>
Sencillo pero interesante! :)
