Rechercher : dans
Par :

Afficher un texte au passage de la souris

Dernière réponse le 9 mai 2008 à 15:05:27 loute08, le 9 mai 2008 à 09:27:25 
 Signaler ce message aux modérateurs

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

Configuration: Windows XP
Firefox 2.0.0.14

Meilleures réponses pour « Afficher un texte au passage de la souris » dans :
Créer un fichier Autorun.inf VoirCréation de fichier autorun Autoriser l'exécution automatique Création du fichier autorun.inf Personnaliser l'icône Personnaliser le texte Personnaliser le menu Autoriser l'exécution automatique Une fonctionnalité de Windows...
PHP - Affichage de texte sur le navigateur VoirLe but de PHP est de permettre la création de pages web dynamiques, ainsi son but premier est de pouvoir envoyer des données au navigateur. Les trois fonctions standards PHP fournit 3 fonctions permettant d'envoyer du texte au navigateur. Ces...

1

PhP, le 9 mai 2008 à 09:43:02

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 ?


PhP  
Il y a 10 types de personnes dans le monde : ceux qui compre­nnent le binaire et les autres ...

Répondre à PhP

2

loute08, le 9 mai 2008 à 09:51:50
  • +1

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>

Répondre à loute08

3

PhP, le 9 mai 2008 à 10:23:05
  • +1

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.

PhP  
Il y a 10 types de personnes dans le monde : ceux qui comprennent le binaire et les autres ...

Répondre à PhP

4

loute08, le 9 mai 2008 à 10:28:55

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

Répondre à loute08

5

bg62, le 9 mai 2008 à 11:51:11

Chapeau PhP !
@+
b g
le 'www' est fait aussi pour communiquer, partager et échanger, non ?

Répondre à bg62

6

bg62, le 9 mai 2008 à 11:52:09

On peut mettre en résolu alors ...
le 'www' est fait aussi pour communiquer, partager et échanger, non ?

Répondre à bg62

7

PhP, le 9 mai 2008 à 11:59:40

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 ?
PhP  
Il y a 10 types de personnes dans le monde : ceux qui compre­nnent le binaire et les autres ...

Répondre à PhP

8

 bg62, le 9 mai 2008 à 15:05:27

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
le 'www' est fait aussi pour communiquer, partager et échanger, non ?

Répondre à bg62
Collection CommentÇaMarche.net