Javascript / CSS3过渡问题

时间:2012-03-20 02:10:13

标签: javascript jquery html css css3

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

http://jsfiddle.net/UVr4A/

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

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

2 个答案:

答案 0 :(得分:0)

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

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

答案 1 :(得分:0)

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

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