jQuery动画无流体

Question

如前所述，我对页面的流动性存在问题，我认为jquery在某种程度上涉及到了这个问题。

我创建了以下一页网站。

http://cgeese.de/tests/Test02/

我在js插件中使用jQuery

http://flesler.blogspot.de/)

• easing (由GSGD，http://gsgd.co.uk/sandbox/jquery/easing/)

，

• local涡旋
• 滚动器)

问题

单击链接可以轻松地将页面滚动到目标div (由easing.js提供)。它技术上很好，但对我的口味来说还不够光滑。

我认为在宽松中口吃的问题是我误用了其中一个插件，但我似乎在代码中找不到一个错误。

问题

为什么动画口吃，我怎样才能使它更流畅？

更新有任何线索吗？似乎使用jQuery内置的宽松看起来更好一些，但问题是相同的。所以我想这不是宽松的插件，只剩下Ariel的东西。有像他的插件吗？

Answer 1

它在铬上看起来很不稳定。改变宽松的方式不会有太大的改变。

您的导航是位置:固定的，是什么导致了整个页面的重新绘制/重新流的每一个导航关键帧。您可以使用铬金丝雀或以下技巧来可视化：http://paulirish.com/2011/viewing-chromes-paint-cycle/

动画滚动也会触发重绘。同时，尽可能多地删除CSS3阴影和渐变，它们很难为浏览器动画。

我认为火狐有一个插件。

你可以优化我的设置它的位置:绝对，并将你的内容放在一个溢出隐藏的div中.(某种假身体)

这里有一篇关于它的优秀文章：http://www.stubbornella.org/content/2009/03/27/reflows-repaints-css-performance-making-your-javascript-slow/

您可以做的另一件事不是动画滚动，而是它自己的元素，把它们放在一个绝对定位的元素，并动画这个元素。

关于再油漆/折返的一些一般指南：https://developers.google.com/speed/articles/reflow