Foros del Web » Creando para Internet » HTML »

scroll vertical y horizontal en tabla

Estas en el tema de scroll vertical y horizontal en tabla en el foro de HTML en Foros del Web. Hola a todos! Mi problema es que tengo una tabla en html muy grande y necesito fijarle un tamaño, poder desplazarme por ella con scroll ...
  #1 (permalink)  
Antiguo 08/06/2009, 02:45
 
Fecha de Ingreso: julio-2008
Mensajes: 62
Antigüedad: 9 años, 4 meses
Puntos: 0
scroll vertical y horizontal en tabla

Hola a todos!
Mi problema es que tengo una tabla en html muy grande y necesito fijarle un tamaño, poder desplazarme por ella con scroll vertical y horizontal de manera que la primera fila y la primera columna se queden fijas, pero que cuando mueva la barra de scroll horizontal se muevan junto con el contenido las cabeceras de las columnas (quedando la primera columna inmóvil) y que cuando mueva la barra de scroll vertical se mueva todo el contenido de la tabla (menos la cabecera).
Espero haberme explicado bien. Mi tabla es un cuadrante de vacaciones en el que en la cabecera hay días de meses y en la primera columna nombres de personas. La tabla muestra en qué fecha se han cogido las vacaciones las personas. Lo que se pretende es que cuando se estén viendo los datos en la tabla podamos saber en todo momento qué mes y qué persona estamos mirando.
Agradeceré todas las sugerencias, tanto código que me podais proporcionar como links de páginas que muestren ejemplos semejantes.
Gracias!
  #2 (permalink)  
Antiguo 08/06/2009, 03:06
Avatar de hades87  
Fecha de Ingreso: diciembre-2007
Ubicación: Barcelona - España
Mensajes: 3.194
Antigüedad: 10 años
Puntos: 68
Respuesta: scroll vertical y horizontal en tabla

Mírate la propiedad e CSS overflow, que creo que te podrá ayudar bastante, de todas formas no acabo de ver muy claro que es lo que quieres.
__________________
No diseñes usando tablas.
  #3 (permalink)  
Antiguo 08/06/2009, 04:26
 
Fecha de Ingreso: julio-2008
Mensajes: 62
Antigüedad: 9 años, 4 meses
Puntos: 0
Respuesta: scroll vertical y horizontal en tabla

Gracias por tu sugerencia aunque ya soy consciente de la propiedad overflow. Lo que necesito es que la primera columna de mi tabla no se pierda cuando me desplace horizontalmente por la tabla. Según vaya haciendo el scroll horizontal que la primera columna siempre esté visible. Y según haga el scroll vertical sea la primera fila la que no se mueva. Aunque tengo metido el overflow con una altura fija cuando mi tabla es muy grande y me salen las barras de scroll yo muevo la de scroll vertical y dejo de ver la cabecera, y del mismo modo la del scroll horizontal y dejo de ver la primera columna. Quiero que eso no ocurra, quiero sequir viéndo siempre parte de la cabecera y parte de la primera columna según dónde me haya posicionado con el scroll.
  #4 (permalink)  
Antiguo 08/06/2009, 04:29
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: scroll vertical y horizontal en tabla

Por la vía de css:
Código css:
Ver original
  1. #contiene_tablas {
  2.    width:750px;
  3.    height: 500px;
  4.    overflow: auto;
  5. }
  6. .encabezado {
  7.    position: fixed;
  8.    /* la anchura tiene que ser menor que "contiene_tablas" */
  9. }
  10. .datos {
  11.    /*define las propiedades que necesites*/}
adapta las medidas al tamaño que necesites para mostrar los datos.

Y en el html
Código html:
Ver original
  1. <div id="contiene_tablas">
  2.     <div class="encabezado">
  3.         <!-- aquí coloca la tabla con los datos que quieres siempre visibles -->
  4.     </div>
  5.     <div class="datos">
  6.          <!-- aquí la tabla con los datos que se "desplazarán -->
  7.     </div>
  8. </div>

Lo anterior no es válido para ie6. Si necesitas compatibilidad con él, Mikmoro tiene en su página: www.araudi.net la estructura que necesitarías.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
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:30.