作为一个实验，我尝试在 JavaScript 中复制 AS3 的 Sprite 功能，而不使用画布对象。我认为使用绝对定位的 div 并操作它们的 css 属性是理所当然的，但是在 Chrome 中，动画引入了奇怪的工件（似乎是因为重绘问题）。
我找不到我做错了什么？事实上，代码非常简单。以下是我尝试过但没有帮助的一些要点：
- 使用相对定位的 div（与绝对定位相反。）
- 使用边距（与顶部和左侧属性相反。）
- 将对象直接附加到 body（而不是附加到容器 div。）
- 使用 setTimeout（与 requestAnimationFrame 相反）
您可以在这里看到一个简化的小提琴：http://jsfiddle.net/BVJYJ/2/ http://jsfiddle.net/BVJYJ/2/
EDIT: http://jsfiddle.net/BVJYJ/4/ http://jsfiddle.net/BVJYJ/4/
在这里您可以在我的浏览器上看到工件：
这可能是我的设置中的一个错误（Windows 7 64 位、Chrome 21.0.1180.75）。没有其他浏览器表现出这种行为。如果有人能评论我可能做错的事情，我将不胜感激。我更好奇这背后的原因，而不是顺便说一句的解决方法。也就是说，任何解释都是受欢迎的。 :)
编辑：示例代码中存在一个错误，导致即使我印象中使用了 RAF，但仍然使用了 setTimeout。 requestAnimationFrame 通过基本转换解决了问题，但问题仍然存在于 CSS 转换（例如旋转）中。
我的 liteAccordion 插件也有同样的问题。可以通过将要设置动画的元素的背面可见性设置为隐藏来修复此问题，如下所示：http://jsfiddle.net/ZPQBp/1/ http://jsfiddle.net/ZPQBp/1/
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
