使用 jQuery 实现真正流畅的动画效果答案

【问题标题】：Really smooth animate effects with jQuery使用 jQuery 实现真正流畅的动画效果
【发布时间】：2010-01-12 00:05:39
【问题描述】：

我在我的页面上设置了一些 jQuery，以便在用户单击链接时交换一些 DIV。 DIV 中包含 Flash 对象、段落和图像，当我单击链接将其换出时，效果并不完全...平滑。

这是我的代码：

$('#div').toggle('fast');
$('#anotherdiv').toggle('fast');

它有点卡在闪光灯对象上一会儿，然后完全消失。有谁知道在 jQuery 中制作非常流畅的动画效果的插件？我看了一下 jQuery UI，但对于我想要它的用途来说似乎有点矫枉过正。

干杯。 :)

【问题讨论】：

标签： jquery toggle jquery-animate smooth

【解决方案1】：

这里的速度问题主要是 Flash ......你要求浏览器快速重绘视频，而不是浏览器擅长做的事情。我会考虑在隐藏之前隐藏 flash 元素，然后在其余部分显示它们，如下所示：

$(function(){
  $('#hideShowButton').toggle(function() {
    $('#div object, #anotherdiv object').hide();
    $('#div').toggle('fast');
    $('#anotherdiv').toggle('fast');
  }, function() {
    $('#div object, #anotherdiv object').show();
    $('#div').toggle('fast');
    $('#anotherdiv').toggle('fast');
  });
});

【讨论】：

另外，我会先在 flash 所在的地方插入一个图像，然后隐藏 flash，然后动画。对用户来说会更流畅。

【解决方案2】：

Javascript 动画确实依赖于浏览器。 IE 在 javascript 上非常慢，而且很多时候甚至不值得尝试使用 IE 进行动画处理。 Firefox 和 chrome 更好。用chrome试试看是否还有问题。

【讨论】：

【解决方案3】：

@stimms 关于速度是正确的，但总有一种解决方法:)

我会在开始动画之前隐藏 Flash 容器。这样就不会碍事了。

【讨论】：

【解决方案4】：

确保对象的wmode 和/或闪存的嵌入标签设置为transparent 或opaque ...

值得一试:)

【讨论】：