javascript - jquery 动画一个 div 到中心

Question

html:

<div id="container">
    <div id="header">
          <div id="animate">
        cartagena
      </div>
        </div>

我想要做的是使用 Jquery 将“动画”div 移动到中心。

我现在的js:

$(document).ready(function() {
      $("#animate").animate({left: "+=512"}, 2000); 
});

现在我想把它放在中心，而不是右边 512 像素处。

Answer 1

我假设 #animate 的位置是 absolute。要使元素在其父元素中居中，只需将其父元素宽度的一半减去其自身宽度的一半添加到 left:

$("#animate").animate({
    left: $("#animate").parent().width() / 2 - $("#animate").width() / 2
}, 2000);

我创建了一个 demo使用 jsFiddle。