このjqueryにアニメーションを追加するにはどうすればよいですか？

Question

このjqueryにいくつかのアニメーションを追加したいと思います。その時点でdivが「ホバリング」でポップアップします。

$(document).ready(function() { 

$('.recruiterLink').hover(function() { 

    $(this).css({ 
     'bottom' : 0 
    }); 

}, function() { 

    $(this).css({ 
     'bottom' : -20 
    }); 

}); 

}); 

どうすればいいですか？おかげ

Answer 1

で.css()を変更するには、（箱から出して動作するはずです）このような何かを探していますか？

$('.recruiterLink').hover(function() { 
    $(this).stop().animate({ 
     'bottom': '0px' 
    }, 500); 
}, function() { 
    $(this).stop().animate({ 
     'bottom': '-20px' 
    }, 500); 
}); 

bottom CSSプロパティを500ミリ秒間アニメーション化します。また、実行中のアニメーションをすべて中止して、（キューイングによって引き起こされる）不自然な動作を防ぎます。

Answer 2

はちょうど次のような.css

.animateに何かが働くだろう変更：

$('.recruiterLink').hover(function() { 
    $(this).animate({bottom : 0},1000); 
}, function() { 
    $(this).stop(false,false).animate({bottom: -20},1000); 
}); 

前のアニメーションが終了していない場合ように、私はホバーオフにストップ機能を追加しましたすぐに終了します。

Answer 3

だけ.animate()

Answer 4

アニメーションjQueryのための例

.stop().animate({ bottom:'-=20px' },"slow") 

ため、.css()機能付き

を置き換える（）APIリファレンス：