Foros del Web » Creando para Internet » CSS »

Scroll vertical en una capa

Estas en el tema de Scroll vertical en una capa en el foro de CSS en Foros del Web. Lo veo difícil, pero a ver si alguien puede echarme una mano. Tengo una web, preparada para resoluciones de 1024 a superiores, estructurada con una ...
  #1 (permalink)  
Antiguo 11/04/2007, 20:10
 
Fecha de Ingreso: abril-2007
Mensajes: 12
Antigüedad: 10 años, 8 meses
Puntos: 0
Pregunta Scroll vertical en una capa

Lo veo difícil, pero a ver si alguien puede echarme una mano.
Tengo una web, preparada para resoluciones de 1024 a superiores, estructurada con una tabla base, con un ancho y un alto al 99%. A su vez esta tabla está dividida en dos celdas, una con un ancho fijo de 150 px y la otra, donde se debe cargar el contenido ejegido en el menú, sin ancho para que se adapte a cualquier resolución.
dentro de está última celda tengo una capa con un ancho del 100% para que se adapte a la celda. El contenido que se cargará en la capa nunca superará el ancho de la capa a resoluciones superiores a 1024, está incluida. Pero el alto si puede llegar a superarse, por lo que a la capa le puse un overflow:auto para que mostrase la barra de desplazamiento solo cuando fuese necesario. El problema es que si a la capa no le pongo alto, me estira tanto la capa como la tabla que la engloba, mostrandome barra de desplazamiento de toda la página, no solo de la capa en cuestión. Poniendo un alto de un 100% ocurre lo mismo. Y si pongo un alto fijo en px ya no se me adapta a resolciones superiores a 1024.
Como podeis ver, la idea es que el menú nunca se mueva, simulando una web con marcos.
He buscado a ver si hay alguna función en php para saber la resolución del cliente y lo máximo que he encontrado es un "mix" de php y javascript con formulario oculto que me "descuajeringa" todo el menú.
Bueno... a ver si alguien sabe algo y podeis ayudarme, que llevo toda la tarde-noche liado con ello condenado por no sacar nada en claro...
  #2 (permalink)  
Antiguo 11/04/2007, 21:59
Avatar de Tecnogal  
Fecha de Ingreso: octubre-2006
Mensajes: 314
Antigüedad: 11 años, 1 mes
Puntos: 5
Re: Scroll vertical en una capa

creo que sin esa tabla podria ser mas facil solucionar tu probelma no cres?. aunque pueda parecer bueno, la verdad es que arruina tu codigo y te genera errores como esos. y como otro comentario se me hace muy arriesgado de tu parte tenerla para resoluciones tan grandes, pues no es un porcentaje representativo
__________________
http://caissastudio.com Portafolio de diseño
http://caissastudio.com/blog blog de frikadas tecnologicas y de diseño
  #3 (permalink)  
Antiguo 12/04/2007, 00:29
Avatar de sumolari  
Fecha de Ingreso: mayo-2006
Ubicación: localhost
Mensajes: 1.367
Antigüedad: 11 años, 7 meses
Puntos: 18
Re: Scroll vertical en una capa

Cita:
Iniciado por Tecnogal Ver Mensaje
creo que sin esa tabla podria ser mas facil solucionar tu probelma no cres?. aunque pueda parecer bueno, la verdad es que arruina tu codigo y te genera errores como esos. y como otro comentario se me hace muy arriesgado de tu parte tenerla para resoluciones tan grandes, pues no es un porcentaje representativo
Busqué sobre las resoluciones y encontré esto:
Cita:
Iniciado por cristalab.com/blog/25645/estadisticas-de-navegacion-y-parametros-de-diseno-web
2006 +Alta 1024x768 800x600 640x480 Desconocido
Ener 17% 57% 20% 0% 6%

2005
Juli 14% 55% 25% 0% 6%
Ener 12% 53% 30% 0% 5%

2004
Juli 10% 50% 35% 1% 4%
Ener 10% 47% 37% 1% 5%
Sobre el scroll, creo que te sería más fácil con capas en lugar de la tabla, como dice tecnogal.
¿Puedes darnos la dirección para que la veamos?

Última edición por sumolari; 12/04/2007 a las 00:31 Razón: dirección
  #4 (permalink)  
Antiguo 12/04/2007, 04:17
 
Fecha de Ingreso: abril-2007
Mensajes: 12
Antigüedad: 10 años, 8 meses
Puntos: 0
Re: Scroll vertical en una capa

Ya probé eliminandado la tabla, pero no solo seguía haciendome lo mismo, si no que la página era aun menos adaptable según las resoluciones.
El código puede resumirse en esto:

Código:
<table align="center" width="99%" height="99%">
<tr>
<td width="21%">
<div style="width:100%">
Código del menú (php y mysql)
</div>
</td>
<td>
<div style="overflow:auto; width:100%; height:568">
Contenido (cargado de la bd a partir del menú o del enlace)
</div>
</td></tr>
</table>
Como veis, la tabla se limita a crear un "esqueleto" sobre el que se asientan las capas. Y la clave la tiene el alto de la segunda capa para que funcione el overflow...
  #5 (permalink)  
Antiguo 12/04/2007, 11:46
 
Fecha de Ingreso: abril-2007
Mensajes: 12
Antigüedad: 10 años, 8 meses
Puntos: 0
Re: Scroll vertical en una capa

Al final resultaba que me estaba complicando la vida a lo tonto, y he optado por usar un script, os lo paso porque puede ser una buena solución en estos casos:

En la cabecera:
Código:
<script>
var alt_res = screen.height
</script>
En el body (en lugar de la etiqueta de apertura de capa):
Código:
<script>
document.write("<div style='overflow:auto; height:");
document.write(alt_res - 200);
document.write(";'>");
</script>
Como se ve, lo que pretendía era que la capa tuviese un alto de 200 px menos que la resolución de pantalla, asi siempre se adapta.
Lógicamente, en el segundo document.write, se pondrian las propiedades de alto que se quiera que tenga la capa. Y en el primer script si en lugar de screen.height, se pone screen.width también funciona para el ancho. Y además también puede servir para tablas, celdas...
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 05:31.