·
miarroba.com
Ajustar ancho a etiqueta DIV según resolución de pantalla
 
Índice de subforos · Ayuda para webmasters · Java y Javascript
Foros · Noticias · Buscar · Usuarios · Fisgona
Mensaje Autor 
#1 ·
Ajustar ancho a etiqueta DIV según resolución de pantalla

Saludos a todos, antes que nada, mencionar que usando el buscador sólo encontré montones de temas con títulos como "AYUDA", "PROBLEMAS" así que disculpen si repito el tema.

Tengo la siguiente necesidad: Necesito que al cargar la página que estoy haciendo, se obtenga la resolución del monitor del usuario visitante y según eso, hacer un par de cálculos y estimaciones y ajustar el ancho de una etiqueta DIV para que se vea mejor la pantalla, quiero garantizar la compatibilidad de mi página con cualquier monitor.

 

He estado buscando pero no he encontrado ninguna solución satisfactoria, ninguna hace absolutamente nada, simplemente el ancho se converva tal y como está escrito.

 

Muchas gracias.


omarenmomarenm
Okupa del foro
Okupa del foro

Haz clic para ver el perfil del usuario
Mensajes: 719
Desde: 07/Ago/2005
02/Oct/2008 01:00 GMT+1
#2 ·
RE: Ajustar ancho a etiqueta DIV según resolución de pantalla

Hola, existen 3 altenativas:

1) con Php: el archivo index.php toma la resolución de la pantalla del visitante, hace el cálculo y genera y envía la página.

2) con HTML (sin código): diseñar los elemetos (div, tablas, etc) utilizando porcentajes.

3) con jScript: luego que se carge la página en el browser del visitante con un script se actualiza el tamaño del div (dinámicamente).

Las 1ra y 2da opciones son transparentes al visitante (limpia) y no se visualizan reajustes a la vista de éste. Para que consideres el uso de jScript: ¿ cuantos elementos se deberían redimensionar?

Salu2


GestionXlsGestionXls
Nació y murió en el foro
Nació y murió en el foro

Haz clic para ver el perfil del usuario
Mensajes: 1.484
Desde: 02/Ago/2008
02/Oct/2008 03:30 GMT+1
#3 ·
RE: Ajustar ancho a etiqueta DIV según resolución de pantalla

Gracias por la idea. Sólo tengo que redimensionar un elemento, tengo un diseño normal de tres columnas, las dos laterales han de ser de ancho fijo y la central de ancho dinámico. No sé por qué no se me había ocurrido utilizar php, no tendría problemas con eso, por alguna razón se me había metido en la cabeza que tenía que usar Javascript, realmente me diste la pista que necesitaba.

 

Edit:

Bueno, ya lo logré, tomo la resolución de la pantalla con el Javascript y redirecciono enviando los valores medidos por GET y php hace el resto del trabajo, pero tengo una duda, hay alguna forma de medir el ancho de la etiqueda body? es que estoy usando el ancho del body como relativo (porcentajes) y me pregunto si es posible obtener un valor absoluto de cuántos pixeles quedó midiendo en la máquina cliente.




Editado por omarenmomarenm, Jueves, 2 de Octubre de 2008, 06:41
omarenmomarenm
Okupa del foro
Okupa del foro

Haz clic para ver el perfil del usuario
Mensajes: 719
Desde: 07/Ago/2005
02/Oct/2008 05:42 GMT+1
#4 ·
RE: Ajustar ancho a etiqueta DIV según resolución de pantalla

Hola (el <body> ocupa todo el ancho del browser ) te paso un script para testearlo:

Spoiler:
<script language="JavaScript">
  function Test_Screen(){
    var ancho=screen.width;
    var alto=screen.height;
    var prof=screen.colorDepth;
    alert("Pantalla= "+ancho+"x"+alto+", "+prof+" bits");
  }
</script>

 


GestionXlsGestionXls
Nació y murió en el foro
Nació y murió en el foro

Haz clic para ver el perfil del usuario
Mensajes: 1.484
Desde: 02/Ago/2008
02/Oct/2008 20:33 GMT+1
#5 ·
RE: Ajustar ancho a etiqueta DIV según resolución de pantalla

Realmente no, porque el body tiene la propiedad width:80% entonces necesitaba saber de qué ancho lo veía el cliente y como no encontré forma de medirlo, ahora se me ocurre que simplemente obtengo el ancho de la resolución y le saco el 86% :D


omarenmomarenm
Okupa del foro
Okupa del foro

Haz clic para ver el perfil del usuario
Mensajes: 719
Desde: 07/Ago/2005
02/Oct/2008 23:36 GMT+1
#6 ·
RE: Ajustar ancho a etiqueta DIV según resolución de pantalla

Interesante, fijate que en:

http://www.w3.org/TR/REC-html40/index/attributes.html

http://www.w3.org/TR/REC-html40/struct/global.html#edef-BODY

todavía no tienen registrada la propiedad 'width' para el tag <body>

Es decir: no es estándar y puede que los navegadores respondan de distinta manera...

 


GestionXlsGestionXls
Nació y murió en el foro
Nació y murió en el foro

Haz clic para ver el perfil del usuario
Mensajes: 1.484
Desde: 02/Ago/2008
03/Oct/2008 03:43 GMT+1
#7 ·
RE: Ajustar ancho a etiqueta DIV según resolución de pantalla

Hola, soy nueva en esto y he visto que ya habiais resuelto con javascript ajustar la pagina a la resolucion de la pantalla del usuario, me podríais explicar cómo sería esa función?

yo tengo una aplicacion que se compone de diferentes divs, y necesito que se adapte a la resolución porque sino se hacen muy pequeños y en algunos momentos no se ve correctamente la página

muchas gracias


krinniskrinnis
Usuario Novato
Usuario Novato

Mensajes: 1
Desde: 24/Mar/2009
24/Mar/2009 10:56 GMT+1
#8 ·
RE: Ajustar ancho a etiqueta DIV según resolución de pantalla

Escrito originalmente por krinnis

Hola, soy nueva en esto y he visto que ya habiais resuelto con javascript ajustar la pagina a la resolucion de la pantalla del usuario, me podríais explicar cómo sería esa función?

yo tengo una aplicacion que se compone de diferentes divs, y necesito que se adapte a la resolución porque sino se hacen muy pequeños y en algunos momentos no se ve correctamente la página

muchas gracias

En el script, estas 2 líneas leen y cargan las medidas de la pantalla:

var ancho=screen.width;
var alto=screen.height;

Luego, calculas el tamaño de cada div (partiendo desde las medidas de la pantalla) y luego le asignas las medidas.

Creo que conviene colocarlo (dentro del head) como primer script.


GestionXlsGestionXls
Nació y murió en el foro
Nació y murió en el foro

Haz clic para ver el perfil del usuario
Mensajes: 1.484
Desde: 02/Ago/2008
24/Mar/2009 19:02 GMT+1
#9 ·
RE: Ajustar ancho a etiqueta DIV según resolución de pantalla

Hola he intentado todo lo que habeis puesto pero no lo consigo 

mi index es este en html

 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

  <title>index</title>

</head>

<body>

<img src="/a.jpg" alt="">

</body>

</script>

</html>

me podeis decir donde poner las cosas? para hacer que esa imagen que le e puesto de fondo se ajuste a las pantallas de todos los ordenadores muchas gracias espero sus respuestas


estado91estado91
Usuario Novato
Usuario Novato

Mensajes: 1
Desde: 24/Jun/2009
24/Jun/2009 15:39 GMT+1
ATENCIÓN: Este tema no tiene actividad desde hace más de 6 MESES,
te recomendamos abrir un nuevo tema en lugar de responder al actual
Índice de subforos · Ayuda para webmasters · Java y Javascript
Temas similares
Asunto Autor#VisitasÚltima respuesta
Usar un logo dependiendo de la resolucion de pantalla25/Sep/2007, 04:15
TekirpTekirp
31.88525/Sep/2007, 18:46
TekirpTekirp Ir al último mensaje del tema
PROBLEMAS CON RESOLUCION DE PANTALLA DE MI PAGINA WEB11/Nov/2006, 17:02
driomariadriomaria
28.09516/Nov/2006, 00:25
driomariadriomaria Ir al último mensaje del tema
Resolucion y/o Navegador09/Sep/2008, 12:00
t3r4byt3t3r4byt3
489109/Sep/2008, 15:38
t3r4byt3t3r4byt3 Ir al último mensaje del tema
redireccionamiento segun sea su configuración de pantalla26/Nov/2007, 22:11
sundury31sundury31
51.65630/Nov/2007, 22:14
NoSetup.orgNoSetup.org Ir al último mensaje del tema
p¿Ahiara que la web s vea bien en todas las resoluciones de pantalla dusuarios?20/Ago/2005, 01:23
mariajacksonmariajackson
195420/Ago/2005, 03:00
system_w1zardsystem_w1zard Ir al último mensaje del tema
Opciones:
Versión imprimible del tema
Subscríbete a este tema
Date de baja de este tema
Ir al subforo:  

TU NO PUEDES Escribir nuevos temas en este foro
TU NO PUEDES Responder a los temas en este foro
TU NO PUEDES Editar tus propios mensajes en este foro
TU NO PUEDES Borrar tus propios mensajes en este foro
Todas las fechas y horas son GMT+1. Ahora son las 18:01
Miarroba Networks, S.L. C/ 18 de Julio, 21 Bajo, 39610 Astillero (CANTABRIA) - CIF B-39512736
Inscrita en el Registro Mercantil de Cantabria, tomo 743, folio 161, libro 0, hoja S-12428, Inscripción 1ª