Javascript / CSS3过渡问题

Question

我有一个页面之间有ajax链接的页面，我在转换时遇到了一些问题。我在jsfiddle上设置了一个演示页面来演示。

http://jsfiddle.net/UVr4A/

问题是，当内容改变高度时，div将最终处于错误的位置并导致非平滑过渡。我尝试了几个尝试来解决这个问题。我目前的解决方案是从div中删除animate属性然后移动它，但这并不总是有效。在我的代码中，我评论了延迟来证明这个问题。即使有50ms的延迟，它也无法正常工作（我认为这是由于浏览器滞后，因为它几乎没有发生在这个jsfiddle上），所以我正在寻找更优雅的解决方案，不会导致转换需要更长时间

我正在使用css3过渡而不是jquery，因为它们往往更顺畅。

Answer 1

我认为问题是css过渡。看看这个：

http://jsfiddle.net/UVr4A/2/

Answer 2

嗯，事实证明这个问题与我的想法无关。 部分原因是我过度简化了我的问题并最终解决了问题。

在我的长页面上，有些图像最终会在转换过程中加载，这是导致跳跃的原因。我用onload事件和超时修复了这个问题。