Redimensionnement d'une balise td

Version imprimable

02/12/2008, 11h09
Lenaick

Redimensionnement d'une balise td
Bonjour à tous,

j'ai un petit problème lorsque je charge ma page, je voudrais que les colonnes de mon tableau se redimensionne. Mais je ne vois pas comment faire. j'ai fait une fonction en javascript mais je ne vois pas ou la mettre
Code:

1 2 3 4 5 6 7 function resize_display(nbBoite) { var largeur_colonne=0; largeur_colonne=(screen.width-100)/nbBoite; return largeur_colonne; }
là je récupère la largeur que devrait faire ma colonne.
Enfin!!!
Si quelqu'un pouvait m'éclairer un petit peu ca m'arrangerai.
Merci d'avance!!!
02/12/2008, 11h20
E.Bzz

Bonjour,
su tu as un <thead>, il faut appliquer ta largeur à la colonne à ce niveau.
Si tu n'en as pas (implicitement uniquement un <tbody>), il faut l'appliquer au <td> du 1° <tr> : il sera répercuté sur les suivants.

A+

Salut,

Tu peux appliquer un style css width aux cellules de la première ligne
de ton tableau.

Code:

1
2
3
4
5
6
7
8
 
largeur_colonne=Math.round((screen.width-100)/nbBoite);
var table = document.getElementById('id_de_ta_table');
var firstrow = table.getElementsByTagName('tr')[0];
var cells = firstrow.getElementsByTagName('td');
for(var i=0;i<cells.length;i++) {
  cells[i].style.width = largeur_colonne + 'px';
}

02/12/2008, 11h23
Lenaick

oki, merci! Mais comment j'appelle ma fonction dans ma balise <td>???

Salut,

Voilà l'idée :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
   <title>Test</title>
	<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
   <style type="text/css">
   * {margin:0;padding:0;}
   body {background:#000;color:#fff;}
   #col1 {width:200px;background:#333;}
   #col2 {width:200px;background:#666;}
   </style>
</head>
<body> 	
   <table>
      <col id="col1" />
      <col id="col2" />
      <tr>
         <td>ligne 1, colonne 1</td>
         <td>ligne 1, colonne 2</td>
      </tr>
      <tr>
         <td>ligne 2, colonne 1</td>
         <td>ligne 2, colonne 2</td>
      </tr>
   </table>
   <script type="text/javascript">
      document.getElementById("col1").style.width = "300px";
      document.getElementById("col2").style.width = "150px";
   </script>
</body>
</html>

edit: oulà! j'arrive longtemps après la bataille. Pourquoi personne n'utilise <col>?

02/12/2008, 12h06
Lenaick

oki franchement c'est cool toutes les réponses que vous m'apportez, mon problème étant que je ne sais pas comment appeler ma fonction dans ma balise TD.
:?
02/12/2008, 12h10
E.Bzz

Citation:

Envoyé par Lenaick

oki franchement c'est cool toutes les réponses que vous m'apportez, mon problème étant que je ne sais pas comment appeler ma fonction dans ma balise TD.

Pourquoi veux-tu l'appeler "dans ta balise <td>" ?? :?

Il suffit d'exécuter la fonction : regarde l'exemple de franculo_caoulene ...

Perso, j'aurais plutôt fait une fonction à appeler dans le onload du <body>.

A+