Afficher un texte au passage de la souris

Résolu/Fermé
loute08 Messages postés 227 Date d'inscription jeudi 24 avril 2008 Statut Membre Dernière intervention 29 août 2015 - 9 mai 2008 à 09:27
bg62 Messages postés 23590 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 15 avril 2024 - 9 mai 2008 à 15:05
Bonjour,

Voilà j'ai ce code qui me permet d'afficher un texte au survol de ma souris mais j'aimerais savoir comment changer la couleur du texte qui pparait

Voici mon code :

<td style="text-align: center;" id="animation">

<div align="right"><span onMouseOver="ChangeMessage('Détection intrusion | Vidéosurveillance | Contrôle d\'accès | Détection incendie','ejs_texte')" onMouseOut="ChangeMessage('','ejs_texte')" style="cursor: default;">Détecter<img src="images/loupe.gif" height="14" width="16" /></span> </div> </td>




<td style="text-align: center;" id="animation">
<span onMouseOver="ChangeMessage('Télésurveillance 24h/24 | Rondes vidéo à distance | Gestion vidéo en temps réel','ejs_texte')" onMouseOut="ChangeMessage('','ejs_texte')" style="cursor: default;">Exploiter<img src="images/loupe.gif" height="14" width="16" /></span></td>





<td style="text-align: center;" id="animation">

<div align="left"><span onMouseOver="ChangeMessage('Gardiennage | Rondes de sécurité | Intervention sur alarme','ejs_texte')" onMouseOut="ChangeMessage('','ejs_texte')" style="cursor: default;">Intervenir<img src="images/loupe.gif" height="14" width="16" /></span></div> </td>

Merci d'avance

6 réponses

PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
9 mai 2008 à 10:23
Après modif ca donne

<html>
<head>
<style>
.survol_bleu
{
	font-size : 20pt;
	color : #0000FF;
	font-weight : bold;
	font-family : arial;
	
}

.survol_rouge
{
	font-size : 12pt;
	color : #FF0000;
	font-weight : bold;
	font-style : italic;
	font-family : courrier;
}
</style>

<!-- DEBUT DU SCRIPT --> 
<script language="JavaScript"> 

function ChangeMessage(message,champ,classe) 
{ 
	if(document.getElementById) 
	{
		var elt = document.getElementById(champ);
		elt.innerHTML = message; 
		elt.className = (classe) ? classe : null;
	}		
} 
</script> 
<!-- FIN DU SCRIPT --> 

</head>
<body>
<a href="" onMouseOver="ChangeMessage('Ici on utilise le style survol_bleu','ejs_texte','survol_bleu')" onMouseOut="ChangeMessage('','ejs_texte')">Passer la souris ici pour voir l'effet du premier style </a> </br>
<a href="" onMouseOver="ChangeMessage('Ici on utilise le style survol_rouge','ejs_texte','survol_rouge')" onMouseOut="ChangeMessage('','ejs_texte')">Passer la souris ici pour voir l'effet du second style </a> 

<div id="ejs_texte"></div>
</body>
</html>



J'ai fait en sorte que tu puisses carrément changer de style (donc pas seulement de couleur mais aussi de police, de mise en forme etc ...) au survole de la souris.

A toi de créer tes propres styles et de passer le nom du chaque style en 3ème paramètres. Tu peux bien sûr réutiliser un même style autant de fois que tu veux.
2
loute08 Messages postés 227 Date d'inscription jeudi 24 avril 2008 Statut Membre Dernière intervention 29 août 2015 1
9 mai 2008 à 10:28
Ok ça marche je te remercie j'ai juste modifié la balise <a href="" Onmouseover...> [...]</a> par un div afin que ce ne soit pas un lien.

Merci beaucoup
0
PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
9 mai 2008 à 09:43
Bjr

En fait tu va devoir modifier le code de la procédure ChangeMessage() ...

C'est quoi le code d'origine de cette procédure ?

0
loute08 Messages postés 227 Date d'inscription jeudi 24 avril 2008 Statut Membre Dernière intervention 29 août 2015 1
9 mai 2008 à 09:51
Le script editer sans rien à l'intérieur :


<!-- DEBUT DU SCRIPT -->
<SCRIPT LANGUAGE="JavaScript">
/*
SCRIPT EDITE SUR L'EDITEUR JAVASCRIPT
http://www.editeurjavascript.com
URL du script : http://www.editeurjavascript.com/scripts/scripts_textes_1_84.php
Ne copiez ce code qu'une fois dans votre page
*/

function ChangeMessage(message,champ)
{
if(document.getElementById)
document.getElementById(champ).innerHTML = message;
}
</SCRIPT>
<!-- FIN DU SCRIPT -->


__________________________


<!-- CODE DU LIEN - VOUS POUVEZ EN PLACER PLUSIEURS SUR VOTRE PAGE -->
<A HREF="" onMouseOver="ChangeMessage('','ejs_texte')" onMouseOut="ChangeMessage('','ejs_texte')"></A>

<!--
CODE DU BLOC QUI VA AFFICHER LE TEXTE QUAND
LE LIEN SERA SURVOLE PAR LA SOURIS
NE COPIER CE CODE QU'UNE FOIS DANS LA PAGE
-->
<DIV ID=ejs_texte></DIV>
0
bg62 Messages postés 23590 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 15 avril 2024 2 362
9 mai 2008 à 11:51
chapeau PhP !
@+
b g
0
bg62 Messages postés 23590 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 15 avril 2024 2 362
9 mai 2008 à 11:52
on peut mettre en résolu alors ...
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
9 mai 2008 à 11:59
Justement les intervenants ne savent pas comment on passe un message au stade résolu (moi non plus d'ailleurs ;-)

je suppose qu'il y a un bouton quelque part non ?
0
bg62 Messages postés 23590 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 15 avril 2024 2 362
9 mai 2008 à 15:05
en haut du post ou dans la partie 'répondre', tu dois voir deux cases
- Problème non résolu
- Problème résolu
et soit tu valides, soit tu coches avant d'envoyer ...
@mitiés
b g
0