css转换+；css转换=跳过的帧[Google Chrome]

当我点击场景时，盒子会掉下来。当我再次单击时，长方体竖起。动画是平滑的，但当我在不同位置多次单击时，动画有时会跳过帧

我在谷歌Chrome的OSX上有这个bug。在Opera中测试-一切正常，没有bug

有人知道如何解决这个问题吗

.scene{
宽度：500px；
高度：500px；
位置：绝对位置；
背景：#efef；
}
.盒子{
位置：绝对位置；
左：250px；
顶部：100px；
宽度：70px；
高度：140像素；
背景：#000；
变换：旋转（0度）；
变换原点：左下角；
过渡：变换600ms线性；
}
.box变换{
变换：旋转（-96度）；
}

$（'.scene'）。在（'click'，function（）上{
$（'.box'）.toggleClass（'box-transform'）；
});

更新：

我注意到，如果将

变换原点设置为
.box transform
而不是
.box
，则不会跳帧：


但在这种情况下，原点在左下角不可见。我真的不明白为什么

更新2[2016年2月16日]：
谷歌Chrome的新版本修复了这个bug。无法在Chrome 48.0.2564.109中复制似乎是与转换单个属性相关的Chrome错误

为了使第二个示例适合您的需要，您可以添加一个愚蠢的转换


$（'.scene'）。在（'click'，function（）上{
$（'.box'）.toggleClass（'box-transform'）；
});
.scene{
宽度：500px；
高度：500px；
位置：绝对位置；
背景：#efef；
}
.盒子{
位置：绝对位置；
左：250px；
顶部：100px；
宽度：70px；
高度：140像素；
背景：#000；
变换：旋转（0度）；
变换原点：左下角；
透视图：1000px；
转换属性：转换视角；
过渡时间：600ms；
过渡时间函数：线性；
过渡延迟：初始；
}
.box变换{
变换：旋转（-90度）；
透视图：1001px；
}

Hi，我使用MAC OS X和google chrome，无法重现您的问题。Hi，请尝试单击问题的不同点scene@imkost嗨，它甚至可以在chrome上复制windows 8。我刚检查过，有一段时间它漏掉了一个框架，或者我们可以说是Smoothness哇，老兄，它确实有效！我向谷歌Chrome报告了一个问题。StackOverflow说，我需要等待15个小时才能授予赏金。别担心！很高兴它有所帮助：-）@imkost你能在这里发布bug报告的链接吗？@Rowno，对不起，我不知道如何获取链接。我只是这样做了：“Chrome->帮助和关于->报告问题…”顺便说一句，我仍然没有收到谷歌的回复。也许我必须找到Chrome的bug追踪器网站并发布在那里。