Javascript 提高多个jQuery动画的平滑度

我创建了这个多层动画，它拍摄了4个图像（“层”），并将它们设置为“缩放”。它通常运行平稳，但偶尔在第三层开始时，第二层动画会出现延迟。我真的不确定为什么/什么时候会发生延迟-可能是由于GPU处理

我能做些什么来减少动画延迟

如果有更好的方法来实现这种效果，我不会坚持使用jQuery.animate——欢迎其他建议

jQuery动画的代码（4层中的1层）：

---

另外，在JS Fiddle示例中，图像大小为9-17kb，但我使用的实际图像大小为131-457kb。不过，图像大小似乎没有多大区别。

css动画通常使用GPU加速，但由于JS只是不断推出新功能，它必须在用户界面javascript中重新评估。简而言之，CSS动画将更加流畅。因为这仅仅是一个UI效果，我不介意把IE8用户留在这样的场合……是的，你说得对。不幸的是，这个简单的动画将被增强以显示重要和有价值的信息，所以我们需要它来处理IE8/9。我不知道该怎么办。也许干脆放弃整个动画创意吧。我不知道你有什么必要放弃它。如果你真的需要动画，你当然可以在IE上使用慢速JQ作为备份。您可以在CSS中使用在所有浏览器中都适用的相同的结束样式，因此这实际上只是一个很小的转换，必须缺少jecky。

setTimeout(function() {
    $('#animation-layer-2').show().animate({
        opacity: '0.9',
        marginLeft: '-490px',
        marginTop: '25px',
        width: '950px'
    }, { duration: 400, queue: false });
}, 500)