Ajouter des ascenseurs dans la page.

Ajouter des ascenseurs dans la page. - HTML/CSS - Programmation

Marsh Posté le 31-10-2008 à 16:19:46    

Bonjour à tous.
 
 
Je dispose d'une page XHTML qui contient (entre autres) plusieurs tableaux. Le problème, c'est qu'ils dépassent largement de la page. Il me faut donc des ascenseurs afin d'éviter d'avoir à scroller horizontalement et verticalement sur la page (uniquement sur la tableau).
 
J'ai trouvé comment faire. Il suffit de rajouter.
 

<div style=" overflow:auto;height:500px;"> </div>


autour de mon tableau.
 
Ça fonctionne sans problème. Mais maintenant j'aimerais pouvoir fixer la première ligne et la première colonne de mon tableau (c'est à dire que quand je scrolle vers le bas, j'ai toujours la première ligne d'apparente et quand je scrolle vers la droite, je vois touours la première colonne).
 
Est ce que c'est possible ?
 
Merci.

Reply

Marsh Posté le 31-10-2008 à 16:19:46   

Reply

Marsh Posté le 31-10-2008 à 17:31:59    

mettre l'overflow sur le tbody?


---------------
Can't buy what I want because it's free -
Reply

Marsh Posté le 03-11-2008 à 11:25:55    

Hello,
 
Merci pour l'idée, mais ça ne fonctionne pas. Déjà, ça ne concerne que les lignes qui ne sont pas des lignes de titres (et ça ne fonctionne pas pour les premières colonnes qui sont aussi des titres de colonnes). Mais même ça ça ne semble pas fonctionner.
 
 
J'ai fait un petit test rapide et ça ne me donne aucun ascenseur (contrairement à un div)
 

Code :
  1. <html>
  2. <head>
  3. <title>test</title>
  4. <body>
  5. <TABLE SUMMARY="This table lists SI (International System) units of
  6.                 measure, giving the name of the unit, its symbol, and
  7.                 the quantity that it measures.">
  8.   <CAPTION>SI Units</CAPTION>
  9.   <THEAD>
  10.     <TR>
  11. <?php
  12.     for ($i=0; $i<20; $i++)
  13. echo '
  14.       <TH SCOPE=col>Name</TH>
  15.       <TH SCOPE=col>Symbol</TH>
  16.       <TH SCOPE=col>Quantity</TH>'; ?>
  17.     </TR>
  18.   </THEAD>
  19.   <TBODY CLASS=base style=" overflow:auto;height:500px;">
  20.     <TR>
  21. <?php
  22. for ($i=0; $i<20; $i++)
  23. echo '
  24.       <TD SCOPE=row>meter</TD>
  25.       <TD>m</TD>
  26.       <TD>length</TD>';
  27. ?>
  28.     </TR>
  29.   </TBODY>
  30. </TABLE>
  31. </body>

Reply

Marsh Posté le 04-11-2008 à 10:19:10    

Pas d'idées ?  
 
 
Ne me dites pas qu'il n'y a pas de solutions :/

Reply

Marsh Posté le 05-11-2008 à 11:19:13    

Bien tant pis, j'abandonne, merci quand même.

Reply

Marsh Posté le 05-11-2008 à 17:10:54    

En CSS pur, c'est complètement infaisable. Déjà rien qu'un overflow vertical sur le tbody tu vas en chier pour un avoir un truc qui fonctionne, sans que ça soit trop dégueux sur la plupart des navigateurs.
 
Maintenant, il reste toujours l'option javascript. En prévoir quand même pour une dizaine de tonnes et quelques arrachages de cheveux pour que ça fonctionne à peu près partout.
 
Autre solution, garantie à 100% : ne rien faire et tant pis si c'est trop long.


Message édité par tpierron le 05-11-2008 à 17:13:22
Reply

Marsh Posté le 06-11-2008 à 09:49:00    

j'ai déjà fait ça un paquet de fois (avoir un tableau scrollable en conservant la premiere ligne)
C'est faisable en fullCSS, mais en utilisant un comportement inattendu de IE6
 
mais sinon voici la méthode d'origine
http://www.cssplay.co.uk/menu/tablescroll

Reply

Marsh Posté le 06-11-2008 à 16:58:11    

Évidemment un tbody scrollable c'est faisable, il (mduchval) l'a même déjà fait.
 
Ce qu'il cherche par contre, c'est beaucoup plus compliqué et surtout infaisable en CSS : que la première ligne soit fixe verticalement et que la première colone soit fixe horizontalement. Donc pas la peine de chercher du coté de CSS, tu ne trouveras rien.


Message édité par tpierron le 06-11-2008 à 17:03:06
Reply

Marsh Posté le 06-11-2008 à 17:49:15    

tpierron ce que tu dis je le sais déjà
je t'ai juste montré que c'est faisable aussi pour IE
le seul problème étant que la ligne de titre (thead) doit etre de hauteur fixe

Reply

Marsh Posté le 06-11-2008 à 20:01:12    

J'ai jamais dis le contraire, hein ....

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed