Rolleover sur du texte
Résolu/Fermé
A voir également:
- Rolleover sur du texte
- Excel cellule couleur si condition texte - Guide
- Transcription audio en texte word gratuit - Guide
- Mettre un texte en majuscule - Guide
- Copier texte pdf - Guide
- Texte barré whatsapp - Guide
16 réponses
tapion76
Messages postés
3775
Date d'inscription
dimanche 8 juillet 2007
Statut
Membre
Dernière intervention
12 janvier 2014
870
12 janv. 2014 à 10:18
12 janv. 2014 à 10:18
OK
Pas spécialiste de ce genre de logiciel.
Je code à la main
Je laisse place donc...
Pas spécialiste de ce genre de logiciel.
Je code à la main
Je laisse place donc...
tapion76
Messages postés
3775
Date d'inscription
dimanche 8 juillet 2007
Statut
Membre
Dernière intervention
12 janvier 2014
870
12 janv. 2014 à 09:36
12 janv. 2014 à 09:36
Bonjour,
Faudrait déjà dire sur quelle logiciel
Faudrait déjà dire sur quelle logiciel
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Utilisateur anonyme
12 janv. 2014 à 12:01
12 janv. 2014 à 12:01
salut, tu peux faire une chose de ce style qui sera à adapter :
<body> <p id="montext"> salut </p> <script type="text/javascript"> var tex = document.getElementById("montext"); tex.onmouseover = function() { tex.style.color = "red"; } tex.onclick = function() { tex.style.color = "green"; } tex.ondblclick = function() { tex.style.color = "yellow"; } </script> </body>
jjaco
Messages postés
530
Date d'inscription
dimanche 20 janvier 2008
Statut
Membre
Dernière intervention
2 juin 2024
45
12 janv. 2014 à 12:23
12 janv. 2014 à 12:23
dans la feuille de style CSS tu peux mettre
p:hover{color:red;}
pour colorer le texte en rouge au survol
p:hover{color:red;}
pour colorer le texte en rouge au survol
C'est presque bon pour ce code sauf que si je passe sur le texte il doit passer par exemple en rouge comme l'exemple mais si je me déplace en dehors du texte il doit revenir en noir , sur un clic il devient et doit reste vert , même si je repasse dessus , et avec deux clics il passe et doit rester en jaune même si je repasse dessus , il ne changera de couleur que si je re-clic dessus .
Je sais pas si c'est clair tous çà ....
un texte est noir , devient rouge au survole , vert si je clic un fois , jaune pour deux clics , mais ne change plus si je le re-survole.
Je sais pas si c'est clair tous çà ....
un texte est noir , devient rouge au survole , vert si je clic un fois , jaune pour deux clics , mais ne change plus si je le re-survole.
Utilisateur anonyme
12 janv. 2014 à 16:50
12 janv. 2014 à 16:50
salut
<body> <p id="montext"> salut </p> <script type="text/javascript"> var tex = document.getElementById("montext"); tex.onmouseover = function() { if (tex.style.color == "green" || tex.style.color == "yellow") { return false; } else { tex.style.color = "red"; } } tex.onmouseout = function() { if (tex.style.color == "green" || tex.style.color == "yellow") { return false; } else { tex.style.color = "black"; } } tex.onclick = function() { if (tex.style.color == "yellow") { return false; } else { tex.style.color = "green"; } } tex.ondblclick = function() { tex.style.color = "yellow"; } </script> </body>
C'est super Merci , juste un détail .
Si j'ai cliqué une fois il passe donc vert , deux il passe jaune , mais si je re-clic une fois , ne peut il pas repasser vert ... ( si j'ai cliqué deux fois par erreur par exemple , ou si j'ai changé d'avis )
Si j'ai cliqué une fois il passe donc vert , deux il passe jaune , mais si je re-clic une fois , ne peut il pas repasser vert ... ( si j'ai cliqué deux fois par erreur par exemple , ou si j'ai changé d'avis )
Utilisateur anonyme
12 janv. 2014 à 19:24
12 janv. 2014 à 19:24
voila essaye ceci et dit moi
<body> <p id="montext"> salut </p> <script type="text/javascript"> var tex = document.getElementById("montext"); tex.onmouseover = function() { if (tex.style.color == "green" || tex.style.color == "yellow") { return false; } else { tex.style.color = "red"; } } tex.onmouseout = function() { if (tex.style.color == "green" || tex.style.color == "yellow") { return false; } else { tex.style.color = "black"; } } tex.onclick = function() { tex.style.color = "green"; } tex.ondblclick = function() { tex.style.color = "yellow"; } </script> </body>
C'est ça , c'est NICKEL
Y a pas ... Quand on s'adresse à des bons , on à du bon boulot
Merci
Un autre petit truc, pourquoi , mes pages HTML ne sont pas identiques suivant les support comme google , firefox , chrome .....
Y a pas ... Quand on s'adresse à des bons , on à du bon boulot
Merci
Un autre petit truc, pourquoi , mes pages HTML ne sont pas identiques suivant les support comme google , firefox , chrome .....
Utilisateur anonyme
12 janv. 2014 à 21:08
12 janv. 2014 à 21:08
Salut, souvent ce problème est surtout avec explorer. Sa vient que les navigateurs interprètent différemment le code. C'est à toi avec tes CSS de faire en sorte que se soit identique ou alors convenablement suffisant.
Bon je comprend pas tout mais merci pour ton code ;)
Peut être serai-je amené à revenir par ici
Peut être serai-je amené à revenir par ici
Re salut
Bon j'ai un autre problème, c'est que ce code je voudrai l'appliquer à plusieurs texte , mais le résultat c'est que je veux que chaque texte changent pas uniquement le dernier
L'idée, c'est une checklist, c'est qu'une fois validé le texte1 en vert ou jaune , je puisse faire valider le texte2 ou 36 , ou 122 puis revenir su le 4 ou 68.
et la çà fonctionne pas terrible puisque c'est toujpours le texte4 qui change
Merci pour votre aide
<body style="height: 27px;">
<table style="text-align: left; height: 23px; width: 393px;" border="1"
cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: middle; height: 17px; width: 137px;">
<p style="margin-top: 1px; height: 4px;" id="montext1">TEXTE1 </p>
<script type="text/javascript">
var tex = document.getElementById("montext1");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
<td style="vertical-align: top; width: 249px;">
<p style="margin-top: 1px; height: 4px;" id="montext5">TEXTE5 </p>
<script type="text/javascript">
var tex = document.getElementById("montext5");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;">
<p style="margin-top: 1px; height: 4px;" id="montext2">TEXTE2 </p>
<script type="text/javascript">
var tex = document.getElementById("montext2");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;">
<p style="margin-top: 1px; height: 4px;" id="montext3">TEXTE3 </p>
<script type="text/javascript">
var tex = document.getElementById("montext3");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;">
<p style="margin-top: 1px; height: 4px;" id="montext4">TEXTE4 </p>
<script type="text/javascript">
var tex = document.getElementById("montext4");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
</tbody>
</table>
<br>
<br>
</body>
Bon j'ai un autre problème, c'est que ce code je voudrai l'appliquer à plusieurs texte , mais le résultat c'est que je veux que chaque texte changent pas uniquement le dernier
L'idée, c'est une checklist, c'est qu'une fois validé le texte1 en vert ou jaune , je puisse faire valider le texte2 ou 36 , ou 122 puis revenir su le 4 ou 68.
et la çà fonctionne pas terrible puisque c'est toujpours le texte4 qui change
Merci pour votre aide
<body style="height: 27px;">
<table style="text-align: left; height: 23px; width: 393px;" border="1"
cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: middle; height: 17px; width: 137px;">
<p style="margin-top: 1px; height: 4px;" id="montext1">TEXTE1 </p>
<script type="text/javascript">
var tex = document.getElementById("montext1");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
<td style="vertical-align: top; width: 249px;">
<p style="margin-top: 1px; height: 4px;" id="montext5">TEXTE5 </p>
<script type="text/javascript">
var tex = document.getElementById("montext5");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;">
<p style="margin-top: 1px; height: 4px;" id="montext2">TEXTE2 </p>
<script type="text/javascript">
var tex = document.getElementById("montext2");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;">
<p style="margin-top: 1px; height: 4px;" id="montext3">TEXTE3 </p>
<script type="text/javascript">
var tex = document.getElementById("montext3");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;">
<p style="margin-top: 1px; height: 4px;" id="montext4">TEXTE4 </p>
<script type="text/javascript">
var tex = document.getElementById("montext4");
tex.onmouseover = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "red";
}
}
tex.onmouseout = function() {
if (tex.style.color == "green" || tex.style.color == "yellow") {
return false;
} else {
tex.style.color = "black";
}
}
tex.onclick = function() {
tex.style.color = "green";
}
tex.ondblclick = function() {
tex.style.color = "yellow";
}
</script></td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
<tr>
<td style="vertical-align: top; width: 137px;"><br>
</td>
<td style="vertical-align: top; width: 249px;"><br>
</td>
</tr>
</tbody>
</table>
<br>
<br>
</body>
Utilisateur anonyme
15 janv. 2014 à 17:44
15 janv. 2014 à 17:44
salut, fais comme ceci :
<body> <p class="montext"> salut 1 </p> <p class="montext"> salut 2 </p> <p class="montext"> salut 3 </p> <p class="montext"> salut 4 </p> <p class="montext"> salut 5 </p> <p class="montext"> salut 6 </p> <p class="montext"> salut 7 </p> <p class="montext"> salut 8 </p> <p class="montext"> salut 1 </p> <p class="montext"> salut 9 </p> <script type="text/javascript"> var tex = document.getElementsByClassName("montext"); for (var i = 0; i < tex.length; i++) { tex[i].onmouseover = function() { if (this.style.color == "green" || this.style.color == "yellow") { return false; } else { this.style.color = "red"; } } tex[i].onmouseout = function() { if (this.style.color == "green" || this.style.color == "yellow") { return false; } else { this.style.color = "black"; } } tex[i].onclick = function() { this.style.color = "green"; } tex[i].ondblclick = function() { this.style.color = "yellow"; } } </script> </body>