hover sur tout une ligne du td

[mario94]

Bonjour j'ai mis un hover dans les balises td donc voilà :

Code :

1
2
3
4
5
6
7
8
9
td:hover {
	background-color: none;
	background-color: #FFFFFF;
}
 
 
td { border: 1px solid black; background-color:#1C1F26; vertical-align:top; }
table { background-color: #13171F; border: 1px solid black; }
th { background-color:#24262D; border: 1px solid black; }

donc quand je passe mon curseur ça change bien la case avec la couleur du hover que j'ai attribué donc ça donne ça :



comment je pourrais le mettre mon hover sur tout la collonne dés qu'on passe la souris car là c'est case par case et moi j'ai éssayé de mettre mon hover sur tout la ligne.

Car moi je voudrais qu'il met sur tout la ligne comme cette capture :



Merci de votre aide

[ornitho13]

Salut,

pour faire ce que tu souhaites, tu dois mettre un

Code :

:hover

sur le

Code :

<tr>

.

[mario94]

Envoyé par ornitho13

Salut,

pour faire ce que tu souhaites, tu dois mettre un

Code :

:hover

sur le

Code :

<tr>

.

merci donc j'ai mis ça sur le css :

Code :

1
2
3
4
5
6
7
8
9
td:hover {
	background-color: none;
	background-color: #24262D;
}
 
 
td { border: 1px solid black; background-color:#1C1F26; vertical-align:top; }
table { background-color: #13171F; border: 1px solid black; }
th { background-color:#24262D; border: 1px solid black; }

et sur mon tableau du forum :

Code :

1
2
3
4
5
6
7
8
        <tr :hover>
        <th></th>
        <th class="titre"><strong><?php echo stripslashes(htmlspecialchars($data['cat_nom'])); ?>
        </strong></th>             
        <th class="nombremessages"><strong>Sujets</strong></th>       
        <th class="nombresujets"><strong>Messages</strong></th>       
        <th class="derniermessage"><strong>Dernier message</strong></th>   
        </tr>

ça ne fonctionne toujours pas.

Peutêtre j'ai mal placé le hover

en tout cas merci de ton aide.

[ornitho13]

tu l'as surtout mal utilisé! le :hover n'existe pas en HTML c'est une pseudo-class CSS, donc à ne mettre que dans le CSS
Avec ton exemple :

Code html :

1
2
3
4
5
6
7
8
<tr>
        <th></th>
        <th class="titre"><strong><?php echo stripslashes(htmlspecialchars($data['cat_nom'])); ?>
        </strong></th>             
        <th class="nombremessages"><strong>Sujets</strong></th>       
        <th class="nombresujets"><strong>Messages</strong></th>       
        <th class="derniermessage"><strong>Dernier message</strong></th>   
        </tr>

et le CSS qui va avec :

Code css :

1
2
3
4
5
6
7
8
9
10
11
tr{
    background-color: none;
}
tr:hover {
	background-color: #24262D;
}
 
 
td { border: 1px solid black; background-color:#1C1F26; vertical-align:top; }
table { background-color: #13171F; border: 1px solid black; }
th { background-color:#24262D; border: 1px solid black; }

[mario94]

merci mais là mon hover il ne change plus de couleur quand je passe mon curseur

merci de ton aide

[Bisûnûrs]

Cf : http://www.developpez.net/forums/d10...ligne-tableau/

[mario94]

Merci ca marche donc voilà le css :

Code :

1
2
3
4
5
tr:hover td{ background-color : transparent; }
 
td { border: 1px solid black; background-color:#1C1F26; vertical-align:top; }
table { background-color: #13171F; border: 1px solid black; }
th { background-color:#24262D; border: 1px solid black; }

mais le souci il marche sur la 1 ligne de la catégorie mais la 2 éme ligne ça ne marche pas le hover enfin juste la case par case

voilà le lien juste pour tester les couleur :

http://template.alwaysdata.net/template/teste_couleur/

donc si on passe sur loisir là c'est bon il met tout la ligne en couleur
et si tu passe sur delire la il met hover sur case par case enfin je croit une fois 3 ou 5

merci de ton aide

ps : on dirait sur firefox ca marche sur tou les ligne sans souci mais sur ie 7 il met 1 fois sur 3 ou 5 la ligne entiere

merci

[Nesmontou]

Bonjour,

Tu pourrais préciser le navigateur (et la version) que tu utilises pour tester ?

[Bisûnûrs]

J'allais le dire .. Avec Firefox 4 et IE8 il n'y a pas de souci.

[mario94]

merci sur firefox chez moi ça marche très bien mais sur ie 8 il met bien mais defois 1 fois sur 4.

merci de votre aide

[Bisûnûrs]

Aucun problème sur IE8 de mon côté.

A tout hasard, au lieu de la valeur transparent de ton background sur le hover, si tu mets une vraie valeur ça donne quoi ?

[mario94]

re j'ai remplacé transparent par une couleur là ca ne bouge pas

c'est bizzare que chez moi i 8 ça ne marche pas et que chez vous ça marche

[Bisûnûrs]

Tu pourrais mettre ta version en ligne à jour ? Parce qu'il y a toujours transparent là ..

Et es-tu sûr d'être sur IE8 ? Pas IE8 en mode compatibilité IE7 ?

[mario94]

j'ai mis une couleur et j'ai supprimé le mot transparent

et je suis bien sur ie8 et firfox c'est 4.0.1

donc tu verra mes hovers ne change plus quand tu passera ton curseur.

merci

[Bisûnûrs]

Code :

tr:hover td{ background-color : 1C1F26; }

Pas de # avant la couleur ?

[mario94]

Merci je n'ai pas vue que j'ai oublié donc :

Code :

1
2
3
4
5
tr:hover td{ background-color : #24262D; }
 
td { border: 1px solid black; background-color:#1C1F26; vertical-align:top; }
table { background-color: #13171F; border: 1px solid black; }
th { background-color:#24262D; border: 1px solid black; }

mais en tout cas firfox ça marche bien mais pas sur ie 8 en tout cas chez moi mais comme chez toi ça marche on va dire que c'est réglé a part savoir pour quoi chez moi il ne fonctionne pas a chaque categorie

merci pour ton aide