Je voudrais ajouter de l'animation à cette jquery, au moment où la div 'apparaît en survol.Comment ajouter de l'animation à cette jquery?
$(document).ready(function() {
$('.recruiterLink').hover(function() {
$(this).css({
'bottom' : 0
});
}, function() {
$(this).css({
'bottom' : -20
});
});
});
Comment puis-je faire cela? Merci
Vous cherchez quelque chose comme ça (devrait fonctionner hors de la boîte)?
$('.recruiterLink').hover(function() {
$(this).stop().animate({
'bottom': '0px'
}, 500);
}, function() {
$(this).stop().animate({
'bottom': '-20px'
}, 500);
});
Cela animez la propriété bottom CSS pour 500 ms. Il annule également toutes les animations en cours d'exécution pour éviter les comportements gênants (causés par la mise en file d'attente).
changer juste le .css à .animate
Quelque chose comme ce qui suit fonctionnerait:
$('.recruiterLink').hover(function() {
$(this).animate({bottom : 0},1000);
}, function() {
$(this).stop(false,false).animate({bottom: -20},1000);
});
J'ai ajouté la fonction d'arrêt en vol stationnaire au large de sorte que si l'animation précédente n'a pas fini ça finit tout de suite.
+1 parce que vous lisez dans mon esprit =) –
A 0 ms animation n'est pas vraiment utile, n'est-ce pas? – jwueller
Désolé n'a pas fini d'écrire. –
simplement changer .css() avec .animate()
Vous devez également spécifier la vitesse. N'est-ce pas expliqué? –
C'est la solution la plus simple à mon problème, mais ajouter .stop() est aussi une bonne idée. – Anthony
@toro: il n'est pas nécessaire de spécifier une durée, ce n'est pas un attribut obligatoire puisque 400ms est la vitesse par défaut. la suggestion fonctionne quand même. ;) –
remplacer .css() fonction
avec, par exemple
.stop().animate({ bottom:'-=20px' },"slow")
pour JQuery animer() référence API:
C'est la meilleure solution Anthony, j'écrivais exactement la même chose, +1. –
Excellente réponse bien rangé merci! – Anthony