Question

I’m trying to add a small nice effect to a submenu but I can’t use marginLeft because it will mess up a bit the container. So I’m trying to it by using left instead of marginLeft, but I can’t get it to work… any ideas why?

$('#order_list li').hover(function(){
  $(this).stop().animate({ "left": "14px" }, 250, function() {
    $(this).animate({ "left": "10px" }, 250);
  });
},function(){
  $(this).stop().animate({ "left": "4px" }, 250, function() {
    $(this).animate({ "left": "0px" }, 250);
  });
});

Answer 1

CSS Left only works on positioned elements.

Try adding position:relative; to the li.

e.g.

#order_list li {
  position: relative;
}