Valoración del artículo:|
Nota: Este artículo hace una distinción de navegadores entre Netscape 4 y otros, para colocar una hoja de estilos distinta en cada caso. El artículo en si está bien, pero la detección del browser está poco actualizada, debido a que ahora hay muchos otros navegadores y nuevas versiones que no se tenían en cuenta.
Hemos publicado otro artículo para enlazar una hoja de estilos para cada navegador detectando navegadores más modernos, que será de interesante lectura para los interesados. |
Empezamos por el ejemplo exacto que nos pedía el suscriptor de la lista de correo, para poner tan sólo fondos distintos. Es un script bastante específico por lo que muchos de vosotros lo encontraréis inservible, pero por lo menos servirá para aprender alguna cosilla.
Con la etiqueta <BODY>
La primera idea que se me ha ocurrido es escribir la etiqueta <BODY> entera dentro de un bloque de script donde tenemos un if que nos permite distinguir entre navegadores.
El código queda algo así:
<html>
<head>
<title>Fondos distintos para cada navegador</title>
</head>
<script language="JavaScript">
if (document.layers)
document.write ("<body background=nts.jpg>")
else
document.write ("<body background=ie.jpg>")
</script>
</body>
</html>
Vemos que para averiguar si tenemos Netscape o Internet Explorer accedemos al objeto layers del documento. Como sólo Netscape tiene ese objeto, sólo para Netscape esa evaluación será verdadera. Esto es un truco rápido, aunque se debería estudiar a parte porque no funciona bien con todos los navegadores, por ejemplo, Netscape 6 mostraría el fondo de Explorer. Más bien, solo distingue entre Netscape 4 y todos los demás navegadores, ya que ciertamente, ese objeto sólo está disponible en ese navegador.
Pero a lo que íbamos, en el ejemplo, dependiendo si se utiliza Netscape 4 u otro navegador se muestra una etiqueta <BODY> con un atributo, el de la imagen de fondo, distinto.
Este ejemplo se puede ver en funcionamiento, pero recuerda que debes entrar con Netscape 4 y otros navegadores distintos para que se muestren los efectos.
Con estilos
Hay otra manera de asignar fondos distintos dependiendo del navegador y no sólo los fondos sino también tipos de letra, tamaños y en general todo lo que se puede definir utilizando los estilos CSS.
En este ejemplo suponemos que sabes algo de CSS y la definición de estilos para todo un sitio incluida en un archivo externo con sintaxis CSS. Para conocer las CSS tenemos un excelente manual en DesarrolloWeb.com.
La base del ejemplo es la misma, utilizamos un bloque script en el que averiguamos qué navegador se está utilizando y dependiendo de el navegador se muestra una etiqueta con unos atributos u otros. En concreto la etiqueta que colocamos dinámicamente en función del navegador es <LINK> que sirve para incluir una declaración de estilos externa.
Sería algo así:
<html>
<head>
<title>Enlazo con estilos dinamicamente</title>
<script LANGUAGE="JavaScript">
if (document.layers) {
document.write("<LINK REL='stylesheet' HREF='estilo_nt.css' TYPE='text/css'>"); }
else {
document.write("<LINK REL='stylesheet' HREF='estilo_ie.css' TYPE='text/css'>"); }
</script>
</head>
<body>
<h1>Bienvenidos a mi página</h1>
</body>
</html>
Como vemos, en caso de estar en Netscape 4 se cargará la hoja de estilos llamada "estilo_nt.css" y si nuestro navegador es otro cualquiera se cargará "estilo_ie.css".
Este segundo caso se puede utilizar para muchas cosas. Principalmente se puede utilizar para evitar un efecto que hay en el uso de distintos navegadores, que consiste en que a misma definición de fuentes los tamaños de las mismas en Netscape e Internet Explorer difieren. (Las mismas fuentes, en Netscape salen más pequeñas que en Explorer). Es por ello que incluyendo una hoja de estilos distinta se puede poner los tamaños de las fuentes deseados para cada navegador.
Se puede ver este script en marcha para comprobar el efecto producido por los estilos distintos dependiendo del navegador.
Eso es todo. Esperemos que os den ideas estos scripts para resolver vuestros problemas.
Sólo comentar de nuevo que hemos publicado una actualización del artículo para tratar de detectar más tipos de navegadores y en distintas versiones y asignarles una hoja de estilos css distinta.
Compartir en redes sociales
| Por: iPhase | 22/11/2001
|
| Por: Miguel Angel Alvarez | 22/11/2001
|
Algunas desventajas de hacer una página para cada navegador son las siguientes:
Usuarios: 
21 de noviembre de 2001
