开发者

best property to manipulate when tweening dom objects with a js library

i'm searching for the best and performant way to animate some elements (with jquery or mootools). for example, if i have to move an element, it's better to:

  • absolutely positioning it and use top or left
  • absolutely positioning it a use

    margin-top or margin-left

  • fixed positioning it and use top or

    left

  • create a big conta开发者_如何学Pythoniner and use the

    background-position


Absolute position + margin manipulation can do a nice trick if you do not specify left/top values.

What trick?

The element with absolute position but no left/top will be rendered in the same position in which a static element would occur, while margin-left/margin-top will add to that position.

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

Overall, I appreciate you don't mention static position as an option — animating such element would cause unnecessary layout reflow, which is the main drawback of DOM/timeout animations.

Among the options you do consider, I think the most performant is the background option. But it has limited application, since you can move only graphic content. So I'd go for option #1.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜