Change de phrase lorsque la souris survole un lien

beaf Messages postés 292 Statut Membre -  
 un_neurone -
Bonjour,

je voudrais faire changer des phrases lorsque je fait survoler ou pointer un lien hypertexte par la souris.

Par exemple:

lien 1 : affiche " Restaurant et une image représentant une table"

lien 2: affiche " Discothèque et une petite illustrant une discothèque "

Lien 3 : affiche " Conférence et une image illustrant une salle de conférence "

Nb: les informations du lien 1, s'affiche par default

Merci

4 réponses

  1. tryan44 Messages postés 1289 Date d'inscription   Statut Membre Dernière intervention   220
     
    Salut,

    Je préviens, je suis un bidouilleur en JS, néanmoins si ça peut aider :

    <script type="text/javascript">
    function change(id,texte){
    var teste = document.getElementById(id);
    teste.innerHTML=texte;
    }
    function restor(id,texte){
    var teste = document.getElementById(id);
    teste.innerHTML=texte;
    }
    </script>
    

    <a id="1" href="#" onmouseover="change(1,'Restaurant et une image représentant une table')"; onmouseout="restor(1,'Texte 1');">Texte 1</a>
    <br/>
    <a id="2" href="#" onmouseover="change(2,'Conférence et une image illustrant une salle de conférence')"; onmouseout="restor(2,'Texte 2');">Texte 2</a>
    0
  2. max103 Messages postés 30 Statut Membre
     
    Salut,

    Je ne pense point que c'est possible.
    0
  3. tryan44 Messages postés 1289 Date d'inscription   Statut Membre Dernière intervention   220
     
    Je pense le contraire :) sauf si je me plante encore ^^:
    function affiche(texte,image){
    	//on affiche ou
    	var teste = document.getElementById("image1");
    
    	//par defaut
    	if(texte == undefined && image == undefined){
    		image = 'restaurant.jpg';
    		texte = 'Restaurant';
    		//on affiche		
    		teste.innerHTML='<img src="'+image+'"/><br/>'+texte;
    	}
    	else{
    		//on affiche
    		teste.innerHTML='<img src="'+image+'"/><br/>'+texte;
    	}
    }
    setTimeout("affiche()",100);
    


    <a href="#" onmouseover="affiche('Restaurant','restaurant.jpg')";>Lien 1</a>
    <br/>
    <a href="#" onmouseover="affiche('Conférence','conference.jpg')";>Lien 2</a>
    
    <div id="image1"></div>
    
    0
  4. un_neurone
     
    tu peux faire ça facilement en jquery

    <script>

    $("image1").onmouseover(function(){
    $("id_du_texte").text("<b>coucou</b>");
    });

    </script>
    0