changer couleur ligne tableau

Version imprimable

Bonjour,

J'aimerai que quand je passe ma souris sur une ligne de mon tableau la couleur change. J'utilise un code simple en JS mais sa ne fonctionne pas.

Code pour changer de couleur
Code:

1 2 3 4 5 6 7 8 9 10 11 <script type="text/javascript"> function changeCouleur(ligne) { ligne.bgColor = '#C0C0C0'; } function remetCouleur(ligne) { ligne.bgColor = '#FFFFFF'; } </script>
Code tableau ASP :
Code:

1 2 response.write"<table cellspacing='0' cellspacing='0' id='tb' class='tb'>" response.write"<tr id='aff_"&i&"' onMouseOver=""changeCouleur(this);"" onMouseOut=""remetCouleur(this);"">"
Mon tableau ce rempli grace a une boucle.

Le code source généré
Code:

1 2 <table cellspacing='0' cellspacing='0' id='tb' class='tb'> <tr id='aff_1' onMouseOver="changeCouleur(this);" onMouseOut="remetCouleur(this);">

18/08/2011, 11h51
andry.aime

Bonsoir,

Essaye avec

Code:

ligne.style.backgroundColor = '#C0C0C0';

A+.
18/08/2011, 11h57
xouzi

Sa change rien :cry:

Ce code fonctionne chez moi (tester sous IE et FF)

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
html>
<head>
<script type="text/javascript">
function changeCouleur(ligne)
  {
	ligne.style.backgroundColor = '#C0C0C0';
  }
 
function remetCouleur(ligne)
  {
	ligne.style.backgroundColor = '#FFFFFF';
  }
</script>
</head>
<body>
<table>
	<tr onmouseover="changeCouleur(this);" onmouseout="remetCouleur(this)">
		<td>blabla</td>
		<td>blabla</td>
	</tr>
	<tr onmouseover="changeCouleur(this);" onmouseout="remetCouleur(this)">
		<td>blabla</td>
		<td>blabla</td>
	</tr>
</table>
</body>
</html>

18/08/2011, 12h46
xouzi

Donc le JS et bon sa doit venir de l'ASP alors pourtant la page html généré parrait correct

Mon tableau et dans un scrollbar est ce que sa peut avoir une explication? Sinon sa peut pas venir de l'id?
18/08/2011, 12h53
andry.aime

ça ne doit pas venir du scrollbar.
Tes balises sont biens fermé? Ton Javascript est dans le même fichier?
Peut-on voir un peu plus sur ton code HTML généré?

PS: met tous tes attributs en minuscule.

A+.

Les lignes doivent changer de couleur dans mon deuxiemes tableaux .
J'ai essayer de faire au plus cour:

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
41
42
43
44
45
46
47
48
49
50
51
52
<html>
<head>
<title>Principal</title>
<link rel='stylesheet' type='text/css' href='style.css' /> 
<script src='functions_saisie.js' type='text/javascript'></script>
</head>
<body>
 
<script type="text/javascript"> 
function changeCouleur(ligne)
  {
	ligne.style.backgroundColor = '#C0C0C0';
  }
 
function remetCouleur(ligne)
  {
	ligne.style.backgroundColor = '#FFFFFF';
  }
 
 
</script>
 
 
<table  cellpadding='0' cellspacing='0' id='tb_p' class='tb_p'>
	<tr>
		<th class='tb_parc_entete_test'><nobr>Valid</nobr></th>
		<th class='tb_parc_entete_2'><nobr>Jour</nobr></th><th class='tb_p_1'><nobr>Date</nobr></th>
	</tr>
</table>
<div class='scrollbar_vertical'>
	<p style='direction:ltr'>
		<table  cellspacing='0' cellspacing='0' id='tb' class='tb'>
			<tr id='aff_ligne_1' onmouseover="changeCouleur(this);" onmouseout="remetCouleur(this)">
				<td class='tb_2'>
					<a href="javascript:aff_zones('1')" title="Modifier la saisie" ><img src="img/ico_act_modif.gif" /></a>
				<td bgcolor='#FFFFFF'  style=''>
					LUN.
				</td>
			</tr>
			<tr id='aff_ligne_3' onmouseover="changeCouleur(this);" onmouseout="remetCouleur(this)">
				<td class='tb_2'>
					<a href="javascript:aff_zones('3')" title="Modifier la saisie" ><img src="img/ico_act_modif.gif"/></a>
				</td>
				<td bgcolor='#FFFFFF'  style=''>
					MAR.
				</td>
			</tr>
		</table>
	</p>
</div>
</body>
</html>

18/08/2011, 13h58
andry.aime

Remplace

Citation:

<td bgcolor='#FFFFFF' style=''>

par

Code:

<td style='backgroundColor :#FFFFFF'>

A+.
18/08/2011, 14h19
xouzi

Je l'ai enlever sa marche Vue que maintenant c'est géré par les fonctions