jQuery animate margin top
You had MarginTop
instead of marginTop
It is also very buggy if you leave mid animation, here is update:
Note I changed it to mouseenter
and mouseleave
because I don't think the intention was to cancel the animation when you hover over the red or green area.
use 'marginTop'
instead of MarginTop
$(this).find('.info').animate({ 'marginTop': '-50px', opacity: 0.5 }, 1000);
check this same effect with less code
$(".item").mouseover(function(){ $('.info').animate({ marginTop: '-50px' , opacity: 0.5 }, 1000);});