If you want to animate the position, in your CSS you must give the element you are trying to animate a property of position: relative;
.
Consider a simple example, in which I want to animate a block to move right, when I click on the document page.
Codepen sketch: http://cdpn.io/vdCth
HTML
<div class='item'></div>
CSS
.item {
background: #ccc;
display: inline-block;
height: 50px;
position: relative;
width: 50px;
}
jQuery
$('html').on('click', function(){
$('.item').animate({
left: "+=50"
}, 200, function(){
});
});
Now remove the position: relative;
from your CSS, and you will see the animation no longer occurs, as demonstrated in this fork: http://cdpn.io/LcakK
Hope that helps.