Déplacement de la table HTML vertical et horizontal

Question

Je cherche à créer une table de largeur et de hauteur fixes qui peuvent défiler verticalement et horizontalement.

Je cherche la première ligne à être l'en-tête fixe, mais aussi la première colonne à être fixée et les autres colonnes à pouvoir défiler vers la droite.

je peux obtenir l'en-tête de travail en tant que tel par quelque chose comme ceci:

http://www.cssplay.co.uk/menu/tablescroll.html

..mais comment pourrais-je obtenir aussi les colonnes de défilement avec le premier restant fixe?

Des idées?

Answer 1

Ce serait un peu facile étant donné que vous travaillez avec une table avec des proportions fixes. Créez simplement un DIV à l'intérieur de la colonne que vous souhaitez faire défiler verticalement et donnez-lui les dimensions fixes de votre choix et ajoutez-lui un attribut 'overflow-y: auto'. L'attribut verflow-y s'assurera seulement de présenter une barre de défilement si le contenu de la div dépasse la zone visible. Exemple:

<style type="text/css"> 
.scrollable { width:300px; height:400px; overflow-y:auto; overflow-x:hidden; clip-rect:(0px, 300px, 400px, 0px); } 
</style> 
<table width="500" height="500" cellpadding="0" cellspacing="0" border="0"> 
    <tr height="100"> 
     <td colspan="2">Banner</td> 
    </tr> 
    <tr height="400" valign="top"> 
     <td width="200">Left Column</td> 
     <td width="300"><div class="scrollable">Scrollable area<br><br><br><br><br><br><br><br><br><br><br>Scrollable area<br><br><br><br><br><br><br><br><br><br><br></div></td> 
    </tr> 
</table>