jquery hover mouse out

Question

Je veux une simple diapositive down/up animation sur une souris sur un lien. Je peux passer la souris au travail mais je n'arrive pas à comprendre comment faire passer le mouseout.

Voici ce que j'ai pour l'effet de vol stationnaire:

<script type="text/javascript" src="http://www.google.com/jsapi"></script> 

<script type="text/javascript"> 

google.load("jquery", "1.3.2"); //load version 1.3.2 of jQuery 

google.setOnLoadCallback(function() { 
    jQuery(
     function($) { 
      $("a.button").hover(function(){$(this).animate({"marginTop": "0px"}, "fast") 

     }); 
    }); 
}); 
</script> 

Comment puis-je obtenir ce pour déplacer la marge jusqu'à 16px lorsque la souris sur?

Answer 1

L'événement vol stationnaire en a besoin jQuery 2 fonctions de rappel: un lorsque le pointeur se déplace sur l'élément, et un quand il quitte:

$(item).hover(function() { ... }, function() { ... }); 

Dans votre cas:

$("a.button").hover(
    function() { 
     $(this).animate({"marginTop": "0px"}, "fast"); 
    }, 
    function() { 
     $(this).animate({"marginTop": "16px"}, "fast"); 
    } 
); 

Answer 2

solution plus simple:

$("a.button").hover(function() { 
    $("a.button").css("cursor","pointer"); 
}); 

Answer 3

Dans les nouvelles versions de jQuery (> = 1.7), vous pouvez également utiliser cette approche:

$("a.button").on('mouseenter',function(){ 
    $(this).animate({"marginTop": "0px"}, "fast"); 
}); 
$("a.button").on('mouseleave',function(){ 
    $(this).animate({"marginTop": "16px"}, "fast"); 
}); 

À mon avis, c'est une approche plus propre, et il profite également de la nouvelle fonction .on() (documentation here)