Discussion :

[guidav]

Bonjour

Comment faire pour changer en javascript la couleur de toute une ligne d'un tableau lorsque l'utilisateur passe la souris dessus ?
En effet, le propriété CSS hover ne fonctionne pas sur la balise <tr> avec IE 6, et j'ai absolument besoin de supporter ce navigateur.
J'ai essayé ce code

Code :

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

echo "<tr name='ligne$w' onMouseOver=\"javascript:ligne$w.bgColor='#339999'\">";

mais apparemment, ça ne fonctionne pas (ni avec name, ni avec id).

Merci d'avance pour toute aide

[Barsy]

peut-être

Code :

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

document.ligne$w.bgColor

ou

Code :

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

this.bgColor

et mets ID

[guidav]

Merci pour ta réponse, mais si je fais

Code :

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

<tr id="ligne6" onMouseOver="javascript:document.ligne6.bgColor='#339999'">

j'ai une erreur document.ligne6 a la valeur null ou n'est pas un objet, et si je fais

Code :

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

<tr id="ligne6" onMouseOver="javascript:this.bgColor='#339999'">

je n'ai aucun effet.
Pour commencer, est-ce que mon JS est correctement écrit ?

[Barsy]

ça a marché chez moi avec le this.

suprimme le 'javascript:' il n'est pas necessaire et remplace

Code :

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

document.ligne6.bgColor

par

Code :

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

document.getElementById('ligne6').bgColor

[Glob]

Code :

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

<tr id="ligne6" onMouseOver="javascript:this.bgColor='#339999'">

je n'ai aucun effet.

Hello.

P'têt avec un

Code :

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

this.style.background-color='#...'

?

D'autre part et d'une façon générale, je préfère appliquer et supprimer des classes CSS aux éléments plutôt que de manipuler directement les styles, que ce soit pour mettre des couleurs, appliquer du hidden ou je sais pas quoi d'autre. C'est plus facile à maintenir et à faire évoluer.

A+

[Barsy]

ce code fonctionne chez moi :

Code :

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

1
2
3
4
5
6
 
<table>	
	<tr id="ligne6" onMouseOver="javascript:this.bgColor='#339999'">
		<td>aa</td><td>bb</td>
	</tr>
</table>

[tusssss]

ce code fonctionne chez moi :

Code :

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

1
2
3
4
5
6
 
<table>	
	<tr id="ligne6" onMouseOver="this.bgColor='#339999'">
		<td>aa</td><td>bb</td>
	</tr>
</table>

JE crois que le "javascript:" n'est pas utile.

[guidav]

Merci, maintenant ça fonctionne, mais seulement si les <td> de la ligne n'ont pas de style défini.
Est-ce possible de faire en sorte que le style du <tr> prime sur celui du <td> qu'il contient ?

Encore merci.

[Barsy]

le mieux serait de faire une fonction Javascript qui va changer la couleur de fond de chacun de tes td. Tu ne pourras pas le faire sinon.

[Auteur]

Code html :

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

1
2
3
4
5
<table>	
	<tr id="ligne6" onMouseOver="javascript:this.bgColor='#339999'">
		<td>aa</td><td>bb</td>
	</tr>
</table>

Il est préférable de passer par l'objet style et backgroundColor plutôt que bgcolor De plus javascript après un événement est inutile, et écrivez les événements en minuscules.

d'où cette petite correction :

Code html :

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

1
2
3
4
5
6
<table>	
	<tr id="ligne6" onmouseover="this.style.backgroundColor='#339999'">
		<td>aa</td>
                <td>bb</td>
	</tr>
</table>