How to add easing to this JQuery script?

Question

I want to add easing to this JQuery hover menu script, how can I do that?

$("#navi_bakery").hover(function(){
        $("#navi_bakery img").animate({
            paddingTop:"0px"
            },100);
    },function(){
        $("#navi_bakery img").animate({
            paddingTop:"17px"
            },100);
        });

Answer 1

It's pretty easy, you just need to choose your easing method. Generic example:

    $(element).animate({
        properties: {top: '17px'}
        duration: 1000, 
        easing: 'method', 
        complete: callback});

Easing methods and examples here: http://easings.net/

Answer 2

http://api.jquery.com/animate/

$("#navi_bakery img").animate({top: 0}, 400, 'swing');

The string at the end is the easing type. By default there's swing and linear, jQuery UI and various other plugins add more.