javascript - Jquery动画问题

Question

我遇到了最奇怪的问题。 我有一个 jQuery 函数，可以为民意调查的结果栏设置动画。

function displayResults()  { 
    $(".q_answers1 div").each(function(){
        var percentage = $(this).next().text();
        $(this).css({width: "0%"}).animate({
            width: percentage}, 'slow');
    });
}

如您所见，这是一个简单的动画，拉长了几个 div。在我将其嵌入到我的主页上之前它工作正常。问题似乎是有太多其他内容破坏了流畅动画的美感。我原以为我在实现 JavaScript、CSS 等方面很蹩脚，但经过几次测试和逆向工程后，我发现页面上的内容(图像、文本、视频)越多，质量就越差动画是。我只能猜测原因是什么......我真的很喜欢我的动画:)!感谢您的帮助!

This demo显示它应该是什么样子。当页面内容较少时，我会像这样工作。我所说的质量差是指酒吧的流动不顺畅。最糟糕的情况是条形图立即显示为最终宽度。在 Mozilla、Chrome 和 IE7 上进行了测试 - 没有区别。

<小时/>

编辑:如果没有实际的例子，你的双手就会被束缚，所以这里有一些工作要做。只需寻找红色边框，选择一个答案，然后单击按钮即可。如果您想知道的话，该语言是保加利亚语。

1. 理想的行为 here
2. 我可以忍受 here
3. 开始看起来很奇怪 here
4. 我不明白这个 here

如果它们对你来说看起来都一样，那么我的电脑就是罪魁祸首，我不必再担心这个特定的问题了，这已经花了 2 多努力了。如果可能，请使用 Mozilla。

<小时/>

编辑2:我发现了这个SO answer这回答了我关于 animate() 函数及其工作原理的一些问题，但问题仍未解决，至少对于我的计算机而言。

Answer 1

我们在这里讨论了多少内容？ 如果页面足够大，浏览器引擎可能根本没有足够的能力来足够快地重新呈现内容以提供流畅的显示。