[HTML] tableau et Scroll

Version imprimable

12/01/2005, 16h16
gwen-al

[HTML] tableau et Scroll

Bonjour,

J'aimerais qu'il y ait dans mon tableau un ascenseur pour le faire défiler.
J'ai essayé de mettre le tableau dans une textarea, mais le code HTML du tableau s'y inscrit en dur.
J'ai essayé la balise div mais j'ai l'impression que cela marche pour rendre une seule cellule scrollable.

Comment pourrais-je procéder?

Merci par avance pour vos réponses.
12/01/2005, 16h21
Maxoo

un div avec une largeur et hauteur, avec overflow:auto
12/01/2005, 16h23
gwen-al

Oui mais comment faire pour que ça marce sur tout le tableau
Je la met à quel niveau ma balise div dans le code?
12/01/2005, 16h25
Maxoo

tu as un tableau <table><tr><td>ici</td></tr></table>

bah tu fais <td><div>ici</div></td>
12/01/2005, 16h46
gwen-al

et je met la balise div à chaque cellule?!?
12/01/2005, 16h53
Alexandre`

Il me semble que "overflow" est dispo sur les <td> d'ailleur, c'était traité il y a quelques jours sur le forum...
12/01/2005, 16h59
SpaceFrog

non pas d'overflow sur les td :cry:
12/01/2005, 17h35
gwen-al

Ben j'y arrive pas...

Quelqu'un peut me donner un exemple de code où il y a un tableau avec une barre de défilement à gauche?

un truc comme ça ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>one</title>
<style type='text/css'>
td.headcol {width:auto;}
 
</style>
</head>
 
<body>
<div style="width:100%;overflow:auto;">
<table border="1" style="width:100%;overflow:hidden;">
<tr colspan=5>
	<td class='headcol' id='col1'>one</td> 
	<td class='headcol' id='col2'>two</td> 
	<td class='headcol' id='col3'>three</td> 
	<td class='headcol' id='col4'>four</td>
   <td style="width:10px;"></td>
</tr>
</table>
<div>
<div style="width:100%;height:200px;overflow-Y:auto;">
<table border="1" style="width:100%;overflow:hidden">
<script type='text/javascript'>
var largcol = new Array()
for (i=1;i<5;i++){
largcol[i]=parseInt(document.getElementById('col'+i).offsetWidth)-3 + "px";
}
for (i=0;i<55;i++){
document.write("\<tr\>\<td style='width:"+largcol[1]+"'\>dsfqsdfsdd dsqf qsdf sdqf sqdf qsdf sdf &nbsp;\<\/td\>\<td style='width:"+largcol[2]+"'\>two\<\/td\>\<td style='width:"+largcol[3]+"'\>three\<\/td\>\<td style='width:"+largcol[4]+"'\>four\<\/td\>\<\/tr\>")
}
</script>
</table>
<div>
 
</body>
 
</html>

12/01/2005, 17h51
gwen-al

merci c'est exactement ce qu'il me fallait :wink:
24/07/2007, 10h41
psgman113

Ok pour le principe,
j'avais trouvé le meme genre de truc mais la légende n'est pas alignée avec les lignes du tableau et c'est ce que je voudrais faire.

Merci
24/07/2007, 11h33
psgman113

http://www.imaputz.com/cssStuff/bulletVersion.html

marche sur IE!

:yaisse2: