Tengo un problema a la hora de implementar un scroll.

Tengo una consulta que hacer, alguien sabe como ponerle scroll tanto vertical como horizontal a una tabla que mostrara un conjunto de resultados...

La FAQ Tengo un problema a la hora de implementar un scroll. tiene

Pertenece a la categoría:

Pregunta
Tengo una consulta que hacer, alguien sabe como
ponerle scroll tanto vertical como horizontal a una
tabla que mostrara un conjunto de resultados porvenientes
de un query??




Lo que quiero lograr es que la tabla no se expanda mucho ni a los
lados ni hacia abajo, por eso la idea de los scrolls. He visto
algunas paginas que lo implementanm, si alguien tiene algo asi
me podria ayudar?


Respuesta de Juan Francisco Salgado Briegas
Para lograr lo que quieres, puedes hacer lo siguiente:
Utilizar tablas para estructurar la tu página y, en la celda que quieras utilizar para mostrar el resultado del query debes insertar un "Frame flotante" (etiquetas <iframe></iframe>) con el mismo ancho y alto que la celda y la propiedad scrolling="auto" para que si el contenido de la página que se carga en el Frame flotante supera el ancho o alto de éste, salga scroll. Si no quieres que salgan los bordes del iframe pon la propiedad frameborder="0".

<iframe name="iframe1" src="página muestra el resultado del query" frameborder="0" scrolling="auto" width="ancho de la celda de la tabla" height="alto de la celda"></iframe>




Observa que tendrás que crear una nueva página que mostrará el resultado del query. Esta página será la que se cargue en el frame flotante (src="query.php").

Complementar la respuestaComplementar la respuesta
Volver al árbol de categoríasVolver al árbol de categorías

Comentarios
Fueron enviados 3 comentarios a la faq
1 comentario no revisado
2 comentarios revisados:
Por: Daniel Oubiña
01/1/06
<html>
<head><title>scroll en td</title></head>
<style type="text/css">
<!--
td.scroll {width: 461px;
height: 400px;
font-family: verdana;
font-size: 9px;
color: #000000;
scrollbar-base-color: #cccccc;
scrollbar-3d-light-color: #cccccc;
scrollbar-arrow-color: #c0c0c0;
scrollbar-darkshadow-color: #CECECE;
scrollbar-face-color: #D2D2D2;
scrollbar-highlight-color: #B0B0B0;
scrollbar-shadow-color: #B0B0B0;
scrollbar-track-color: #DADADA;
}
-->
</style>
<body>
<table><tr><td class="scroll">Este Es El td que obtendra el scroll con una anchura de 461 y una altura de 400
</td></tr></table>
</body>
</html>

Por: Quico
27/3/06
<div style="overflow-y:scroll; height:150; width:500;">
<pre>
Lo más comodo y funcional es usando una capa:
overflow:hidden; (no las muestra nunca) (por defecto)
overflow:auto; (depende del contenido)
overflaw:scroll; (siempre las muestra)

si lo que quieres es configurar las barras por separado:
overflow-y (añadiendo "-y" se configura la vertical)
overflow-x (añadiendo "-x" se configura la horizontal)
</pre>
</div>

Volver al árbol de categoríasVolver al árbol de categorías
Alojados en el grupo