Thumbnail bottom distance animate

by lovromar

HTML

<div id="footer">
   <a href="http://placekitten.com"><img src="http://placekitten.com/100/100"></a>
    <a href="http://placekitten.com"><img src="http://placekitten.com/g/100/100"></a>
</div>

CSS

#footer {
    padding: 10px;
}

a {
    position: relative;
    bottom: 0;
}

JavaScript

$("#footer").find("a").hover(function () {
    $(this).animate({
        bottom: '+=10'
    }, 200);
}, function () {
    $(this).animate({
        bottom: '-=10'
    }, 200);
});