Jquery Mouseenter/Mouse Quitter l'image swap

Question

J'ai donc écrit ce petit bout de code pour essayer une nouvelle façon de faire un échange d'images à des fins de préchargement et j'ai un peu de mal. Mon problème est que j'ai un conteneur avec les images qui ont un peu de remplissage et de texte, mais l'activation de mon roulement se produit seulement quand quelqu'un survole l'image, au lieu du conteneur. Je dois avoir un petit peu tort, j'espère que quelqu'un pourra m'aider. Encore à apprendre!

Voici le code html:

<div class="projectThumb"> 
    <img src="/img/aeffect_button_static.gif" width="146" height="199" class="static" name="aeffect" alt="" />   
    <img src="/img/aeffect_button_rollover.jpg" width="146" height="199" class="rollover" name="aeffect" alt="" /> 
    <p class="title">A.EFFECT: Film Poster</p> 
</div> 

Voici le jquery:

$(document).ready(function(){ 
    $(".rollover").hide(); 
$(".projectThumb").mouseenter(
     function(){ 
      $(this).attr(".static").hide(); 
     }, 
     function(){ 
      $(this).attr(".rollover").show(); 
     }); 
$(".projectThumb").mouseleave(
     function(){ 
      $(this).attr(".rollover").hide(); 
     }, 
     function(){ 
      $(this).attr(".static").show(); 
     }); 
}); 

Answer 1

Je pense que vous êtes à la recherche hover:

$(document).ready(function(){ 
    $(".rollover").hide(); 
    $(".projectThumb").hover(
    function(){ 
     $(this).find(".static,.rollover").toggle(); 
    }, 
    function(){ 
     $(this).find(".static,.rollover").toggle(); 
    }); 
}); 

Les deux mouseenter et mouseLeave prendre seulement un argument, mais vous définissez deux fonctions de rappel.

Answer 2

Pourquoi ne pas essayer:

$(".projectThumb").bind("mouseenter mouseleave", function(e) { 
    $(this).toggle(); 
});