javascript - 使用 js 库补间 dom 对象时操作的最佳属性

Question

我正在寻找对某些元素进行动画处理的最佳和高性能方式（使用 jquery 或 mootools）。例如，如果我必须移动一个元素，最好：

• 绝对定位它并使用顶部或左侧
• 绝对定位它使用
  margin-top 或 margin-left
• 固定定位它并使用顶部或
  左侧
• 创建一个大容器并使用
  背景位置

Answer 1

如果您不指定left/top值，绝对位置 + 边距操作可以起到很好的作用。

什么套路？

具有绝对位置但没有left/的元素top将呈现在静态元素将出现的相同位置，而margin-left/margin-top将添加到该位置。

http://jsfiddle.net/e6PaE/1/

总的来说，我很感激你没有提到静态位置作为一个选项——动画这样的元素会导致不必要的布局重排，这是 DOM/超时动画的主要缺点。

在您考虑的选项中，我认为性能最高的是后台选项。但它的应用有限，因为您只能移动图形内容。所以我会选择选项#1。