0

我正在使用packery制作动画。瓷砖在网格中对齐，单击一个应该放大它并相应地动态重新排列瓷砖。使用 CSS3 过渡动画调整大小。所有这些都在 IE10 和 Firefox 中按预期工作，如以下代码笔所示： http ://codepen.io/anon/pen/ilkmK

基于 WebKit 的浏览器（在 Windows 上测试）中的相同代码在调整大小和重新定位时会产生疯狂的摆动/晃动。

我已经提交了一个问题，问题似乎是 WebKit 中的宽度和高度转换没有优化。使用 jQuery.animate 实现相同的动画稍微改善了这种情况，但它并没有摆脱摆动。特别是在较慢的系统上，它仍然非常明显。

现在我使用 JavaScript 版本作为稍好一点的 fallbackf 或 webkit 浏览器，但它不是最佳的。我不知道从这里去哪里，所以我希望 Stackoverflow 可以帮助我。

对于如何在 Chrome/Safari 中进行这项工作的任何提示，我将不胜感激。

4

1 回答 1

0

我刚刚在 Mac 上的 Chrome 中尝试过这个，它工作正常，所以我无法复制这个问题。但是我有一种感觉，这可能与 webkit 浏览器加载页面时它们最初生成的图像尺寸为 0 的事实有关。

尝试将您的 jQuery 放入$(window).load(function(){而不是$(document).ready(function(){

这将在执行脚本之前等待图像加载。

于 2013-10-15T12:22:42.723 回答