salut,
je veux q'une fois je coche un checkbox, toute la ligne de checkbox prend une couleur, ça veux dire que tous le td où se trouve ce checkbox prend une couleur différente..
Merci
salut,
je veux q'une fois je coche un checkbox, toute la ligne de checkbox prend une couleur, ça veux dire que tous le td où se trouve ce checkbox prend une couleur différente..
Merci
Code : Sélectionner tout - Visualiser dans une fenêtre à part onmouseup="this.parentNode.parentNode.style.backgroundColor=(this.checked)?'red':'white';"
S'il vous j'aimerai quelque chose de plus sinificative
Merci d'avance
Pfff ... ils ne font vraiment plus aucun effort
Bon je suis de bonne humeur et voilà ce que ça peut donner :
arf juste un detail à regler si click trop rapides ...
Code : 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
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
53
54
55
56
57
58 <script type='text/javascript'> function highlightLine(obj){ setTimeout(function(){ if(obj.parentNode.parentNode.colored==undefined){obj.parentNode.parentNode.colored=0;} obj.parentNode.parentNode.colored+=(obj.checked)?1:-1; if (obj.parentNode.parentNode.colored==0){obj.parentNode.parentNode.style.backgroundColor='white'; return true;} else{obj.parentNode.parentNode.style.backgroundColor=((obj.checked=='false')&&(obj.backgroundColor!='red'))?'white':'red';} } ,100) } </script> </head> <body> <table border="1" width="100%"> <tr> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="12%"><input type="checkbox" onmouseup="highlightLine(this)"></td> </tr> <tr> <tr> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="12%"><input type="checkbox" onmouseup="highlightLine(this)"></td> </tr> </tr> <tr> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="12%"> </td> </tr> </table> </body> </html>
en fait on doit pouvoir virer le setTimeout
Merci bcp SpaceFrog, au fait je ne voulais pas tout le code, juste des petites explications parce que DOM c'est pas mon point fort!!
Merci, espérant que tu resteras tjrs en bonne humeur.
Bon voilà le souci des doubles et triples et multiclicks résolu :
Code : 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
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
53
54
55
56 <script type='text/javascript'> var clicked=false; function highlightLine(obj){ if(clicked){return true;} clicked=true; if(obj.parentNode.parentNode.colored==undefined){obj.parentNode.parentNode.colored=0;} obj.parentNode.parentNode.colored+=(obj.checked)?1:-1; if (obj.parentNode.parentNode.colored==0){obj.parentNode.parentNode.style.backgroundColor='white'; clicked=false; return true;} else{obj.parentNode.parentNode.style.backgroundColor=((obj.checked=='false')&&(obj.backgroundColor!='red'))?'white':'red';} clicked=false; } </script> </head> <body> <table border="1" width="100%"> <tr> <td width="11%"><input type="checkbox" onmousedown="highlightLine(this)" ondblclick='return false;'></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)" ondblclick='return false;'></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)" ondblclick='return false;'></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)" ondblclick='return false;'></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="12%"><input type="checkbox" onmouseup="highlightLine(this)"></td> </tr> <tr> <tr> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="11%"><input type="checkbox" onmouseup="highlightLine(this)"></td> <td width="12%"><input type="checkbox" onmouseup="highlightLine(this)"></td> </tr> </tr> <tr> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="11%"> </td> <td width="12%"> </td> </tr> </table>
Voici mon bout de code:
ça marche parfaitement mais j'avais pas prévue la possiblité de choisir plusieurs ligne en appuyant sur SHIFT + bouton HAUT ou BAS..
Code : 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
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
53
54
55
56
57
58 <script type='text/javascript'> function highlightLine(obj) { var number=0; if(obj.parentNode.parentNode.colored==undefined) { obj.parentNode.parentNode.colored=0; } obj.parentNode.parentNode.colored+=(obj.checked)?1:-1; if(obj.parentNode.parentNode.colored==0) { obj.parentNode.parentNode.style.backgroundColor='white'; return true; } else { obj.parentNode.parentNode.style.backgroundColor=((obj.checked=='true')&&(obj.backgroundColor!='#CCCCCC'))?'white':'#CCCCCC'; } //alert (obj.checked); for (var i=0; i<obj.parentNode.parentNode.length; i++) {if(obj.parentNode.parentNode.checked==true) alert('ok'); } } </script> <style type="text/css"> <!-- .Style1 {font-family: "Book Antiqua";font-size: 12px;} --> </style> </head> <body> <table border="1" cellpadding="0" cellspacing="0" width="47%"> <tr> <td width="11%"> <input type="checkbox" id="c1" onclick="highlightLine(this)"> <label for="c1"><span class="Style1">Vous avez reçu un nouveau message</span></label> </td> </tr> <tr> <td width="11%"> <input type="checkbox" id="c2" onclick="highlightLine(this)"> <label for="c2"><span class="Style1">Vous avez reçu un autre nouveau message</span></label> </td> </tr> <tr> <td width="11%"> <input type="checkbox" id="c3" onclick="highlightLine(this)"> <label for="c3"><span class="Style1">Vous avez reçu un avant dernier nouveau message</span></label> </td> </tr> <tr> <td width="11%"> <input type="checkbox" id="c4" onclick="highlightLine(this)"> <label for="c4"><span class="Style1">Vous avez reçu un dernier nouveau message</span></label> </td> </tr> </table>
Avez-vous une idée comment je pourrai effectuer ça??
Merci
Vous avez un bloqueur de publicités installé.
Le Club Developpez.com n'affiche que des publicités IT, discrètes et non intrusives.
Afin que nous puissions continuer à vous fournir gratuitement du contenu de qualité, merci de nous soutenir en désactivant votre bloqueur de publicités sur Developpez.com.
Partager