我创建了一个翻书动画，并在 Chrome、Firefox 和 Safari 中对其进行了测试，你可以在这里看到它的实际效果：
http://codepen.io/tcmulder/pen/omyuE
不幸的是，它在 Safari 中无法正常工作，因为动画结束后，z-index 似乎失去了它的力量，最左边的页面重新定位在堆栈的顶部。它可能与此处发现的问题有关：
webkit转换translate3d后css z-index丢失
但建议的解决方案不起作用。我还尝试使用 rotate3d 更改 x 坐标以将其欺骗为一种伪 z-index 覆盖，但这似乎也效果不佳。
动画结束后如何让 Safari 保留 z-index？