Foros del Web » Programando para Internet » Javascript »

Banners adaptables al tamaño de la pantalla

Estas en el tema de Banners adaptables al tamaño de la pantalla en el foro de Javascript en Foros del Web. Estoy buscando la manera de cambiar los banners de acuerdo al tamaño de la pantalla del usuario. Ejemplo: tengo dos opciones de banners, uno de ...
  #1 (permalink)  
Antiguo 13/02/2009, 08:59
 
Fecha de Ingreso: agosto-2005
Mensajes: 82
Antigüedad: 18 años, 9 meses
Puntos: 0
Banners adaptables al tamaño de la pantalla

Estoy buscando la manera de cambiar los banners de acuerdo al tamaño de la pantalla del usuario.

Ejemplo:

tengo dos opciones de banners, uno de 468x60 y otro de 700x90.

Si el usuario tiene una resolucion de pantalla menor o igual a 800px quisiera mostrar el banner de 468x60

En cambio si el usuario tiene una resolucion de pantalla superior a 800px mostrar el banner de 700x90.

¿Algun script que me permita hacer esto?

Desde ya muchas gracias
__________________
www.foros.com.ar
  #2 (permalink)  
Antiguo 13/02/2009, 09:02
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.720
Antigüedad: 19 años
Puntos: 839
Respuesta: Banners adaptables al tamaño de la pantalla

Puedes usar screen.width y screen.height para saber la resolución utilizada por el usuario y de acuerdo a eso cambiar el banner.
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #3 (permalink)  
Antiguo 13/02/2009, 11:01
Avatar de SPAWN3000  
Fecha de Ingreso: marzo-2008
Ubicación: Bogota
Mensajes: 858
Antigüedad: 16 años, 2 meses
Puntos: 15
Respuesta: Banners adaptables al tamaño de la pantalla

No me parece una buena técnica tener archivos para cada página ya que en un momento de actualización esto se torna algo complicado, es mejor:

1. usar flash con imágenes vectoriales que se adapten a la pantalla...
2. El control de dimensiones delegarlo a CSS(Diseños líquidos con capas).

Otra forma podría ser cargar un css de acuerdo a la resolución, en el css especificas el archivo a cargar y listo.

Un archivo por defecto es File800.css que puede ser de 800x600.
<link id="filecss" href="File800.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
//Puedes tener resolución para todo tipo...
document.getElementById('filecss').href='File' + screen.width + '.css'
</script>

Con esta propiedad si agregas .style podrías alterar el tipo de fuente, tamaño de letra y guardando una cookie de configuración del lado del cliente para que persistan sus preferencias.

Es más fácil actualizar un CSS, que las páginas una a una.

Un saludo.

Tus archivos pueden ser:
File800.CSS
File1024.CSS
...

Última edición por SPAWN3000; 13/02/2009 a las 11:11
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:52.