我在 codepen 上复制了我的代码以更好地显示问题。
动画在 chrome 上运行良好,但在 safari 上运行不正常。
http://codepen.io/prismosoft/pen/akVzQg
当插入器旋转并使用 translateZ 推回时,我正在对包装器背景 div 应用缩放变换。现在即使 pusher 设置为:
translateZ(-1000px)
我希望 wrapper 背景作为背景留在 pusher 后面。为什么 safari 的行为不像 chrome ?我错过了什么吗?
最佳答案
我终于发现这个问题很傻!由于 wrapper bg div 位于 wrapper div 中,其视角为 1500px。只需将包装器 bg 移到包装器 div 之外即可解决此问题。
关于Safari 与 Chrome 上的 CSS 转换动画问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38316345/