Discussion :

[Invité]

bonjour,

j'ai un tableau dont je connais l'ID qui comporte 3 colonnes dont je ne connais pas les ID.
Chaque colonne comporte plusieurs élement de class BOITE.
Je voudrais que 1er élement BOITE de chaque colonne ait un padding top augmenté.

Mon problème : avec jquery, il y a la methode .first mais elle ne peut pas être "resetté par colonne", elle le fait que sur l'ensemble du document ! et comme un talbeau est accessible que par TR et non par "colonne", je ne sais pas comment faire ?

par exemple j'ai un code similaire à ça :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<table id="montableau">
<tr>
<td><div class="boite">texte1</div><div class="autrechose">Grrrr</div></td>
<td><div class="autrechose">Grrrr</div></td>
<td><div class="boite">texte2</div><div class="autrechose">Grrrr</div></td>
</tr>
<tr>
<td><div class="autrechose">Grrrr</div></td>
<td><div class="boite">texte3</div><div class="autrechose">Grrrr</div></td>
<td><div class="boite">texte4</div><div class="autrechose">Grrrr</div></td>
</tr>
<tr>
<td><div class="autrechose">Grrrr</div></td>
<td><div class="autrechose">Grrrr</div></td>
<td><div class="boite">texte5</div><div class="autrechose">Grrrr</div></td>
</tr>
</table>

si j'utilise cette technique de .first :
https://api.jquery.com/first/

alors je fais :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$( ".boite" ).first().css( "padding-top", 50 );

mais le problème c'est que ça modifie que la premiere "boite" de la 1ere colonne et hélas pas toutes les 1eres boites de chaque colonne.

Dans mon résultat souhaité, texte1 texte3 et texte5 devraient avoir leur padding-top augmenté...
sachant que je ne sais pas où ils sont positionné, ni leur id, ni même s'ils sont là, je veux juste augmenter le padding du 1er élement de class BOITE dans chaque TR (colonne).

une idée de comment je pourrais itérer/parcourir cela sans IDs des colonnes ?

merci de votre conseil ou tuyaux.