CSS相对于固定位置-CSS转换

Question

描述

我试图让div看起来像是从它所在的位置开始生长。为此，我将位置从相对更改为固定，这使得第一个转换从top:0, left:0开始，而不是从元素的当前左上角开始。如何修复此问题以使用元素的当前偏移？

JS Fiddle

http://jsfiddle.net/ZjWkD/

注意：第一次点击后，代码会按照我想要的方式运行。第一次点击就是问题所在。

Answer 1

你好，谢谢你的小提琴，

当你第一次在这里设置css时，除了在点击函数中设置初始位置外，你的目标div上还有一些转换，这让事情有点混乱。

$(this).css({
    position:'fixed',
    top:$(this).offset().top,
    left:$(this).offset().left
});

在点击功能启动之前设置目标div的位置将正确定位div，应用不带动画的css将确保加载文档时目标div位于正确的位置（如果将动画保留在该目标div上，即使在$（document）.ready中应用起始css，它也会加载页面并运行动画，而不是让div从那里开始）。

我为动画使用了一个单独的类，并且只有在设置了初始位置后才应用它（请参阅下面fiddle中的.test类）。

http://jsfiddle.net/Jag96/wdh4N/