image ID non défini dans Firefox

Question

La fonction suivante pour changer la source d'image sur le vol stationnaire de la souris/mouseout fonctionne dans Chrome:

$(document).ready(function() { 
      $('#img_home').mouseover(function() { 
       img_home.src = 'img/btn/act/home2.gif'; 
      }) 
      .mouseout(function() { 
       img_home.src = 'img/btn/pas/home.gif'; 
      }); 

Dans Firefox la console de la img_home 'affiche non défini.

Voici le balisage:

<a href="Default.aspx"> 
    <img alt="home" src="img/btn/pas/home.gif" 
    id="img_home" style="border: none" /> 
</a> 

Toutes les idées?

Answer 1

Vous devez utiliser this, il se référer à l'élément concerné:

$(document).ready(function() { 
    $('#img_home').mouseenter(function() { 
     this.src = 'img/btn/act/home2.gif'; 
    }) 
    .mouseleave(function() { 
     this.src = 'img/btn/pas/home.gif'; 
}); 

Answer 2

Vous ne voulez pas:

$('#img_home').src = ... 

Sauf si vous avez défini la variable img_home avant l'extrait de code vous avez ajouté, il n'y a pas de variable connue avec un nom de img_home.

Answer 3

Vous devez utiliser this pour faire référence à l'élément, et non pas son id:

$(document).ready(function() { 
    $('#img_home').mouseover(function() { 
     this.src = 'img/btn/act/home2.gif'; 
    }).mouseout(function() { 
     this.src = 'img/btn/pas/home.gif'; 
    }); 
});