Changer l'image d'un bouton sur événement onmouseover

Bonjour,

Soit un bouton "abonné". Lorsque l'utilisateur passe la souris sur le bouton, celui-ci doit se transformer en "se désabonner".

Le code du bouton "abonné" :

Code:

---

1 2 3 4

<img onmouseover="change_btn_following('img_btn_following_14', fr, 16, 14)" src="images/profil/btn_following_fr.png" id="img_btn_following_14" >

---

Le code de la fonction change_btn_following :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

/**  * change_btn_following  * change le bouton following (abonné) en unfollow (se désabonner)  * @param id  */ function change_btn_following(id, langue, id_membre_connecte, id_votant) { var chemin = "images/profil/btn_unfollow_" + langue + ".png"; var action = "unfollow(" + id_membre_connecte + ", " + id_votant + ")"; document.getElementById(id).src = chemin; document.getElementById(id).style = "cursor: pointer"; document.getElementById(id).onclick = action; }

---

Malheureusement, rien ne se passe. :cry:
Qu'est-ce qui cloche dans mon code ?

Bonjour,
tu peux faire un truc dans ce style

Code:

---

1 2 3 4

<img onmouseover = "this.src ='http://www.developpez.net/forums/images/buttons/proposer-actu.gif'" onmouseout = "this.src ='http://www.developpez.net/forums/images/buttons/reply.gif'" src="http://www.developpez.net/forums/images/buttons/reply.gif" >

---

donc...pour ta fonction tu peux passer directement l'objet à la fonction via le mot clé this après correction de quelques maladresses, voir code

Code:

---

1 2 3 4 5 6 7 8 9

function change_btn_following( obj, langue, id_membre_connecte, id_votant){ // var chemin = 'images/profil/btn_unfollow_' + langue + '.png'; // var action = 'unfollow(' + id_membre_connecte + ', ' + id_votant + ')'; obj.src = 'images/profil/btn_unfollow_' + langue + '.png'; obj.style.cursor = 'pointer'; // ici style.cursor obj.onclick = function(){ // on passe par une fonction anonyme unfollow( id_membre_connecte, id_votant); } }

---

Merci pour la réponse mais pas sûr d'avoir bien compris car ce je j'ai fait ne fonctionne pas. :cry:

J'ai juste remplacé l'id de l'image par this dans l'appel de la fonction :

Code:

---

<img onmouseover="change_btn_following(this, fr, 16, 14)" src="images/profil/btn_following_fr.png" id="img_btn_following_14">

---

Et j'ai pris ton code Javascript :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

/**  * change_btn_following  * change le bouton following (abonné) en unfollow (se désabonner)  * @param id  */ function change_btn_following(obj, langue, id_membre_connecte, id_votant) { obj.src = 'images/profil/btn_unfollow_' + langue + '.png'; obj.style.cursor = 'pointer'; obj.onclick = function() { unfollow( id_membre_connecte, id_votant); } }

---

Il ne se passe toujours rien quand je passe la souris sur l'image "abonné".

Petit détail qui a peut-être son importance : l'image est dans une Fancybox.

attention dans

Code:

---

onmouseover="change_btn_following(this, fr, 16, 14)"

---

fr est une chaine de caractère et non une variable il te faut donc écrire

Code:

---

onmouseover="change_btn_following(this, 'fr', 16, 14)"

---

OK c'était bien ça. Merci.