フリップブック アニメーションを作成し、Chrome、Firefox、および Safari でテストしました。実際の動作はこちらで確認できます。
http://codepen.io/tcmulder/pen/omyuE
残念ながら、アニメーションが終了した後、z-index がその力を失い、一番左のページがスタックの一番上に再配置されるため、Safari では正しく機能しません。ここで見つかった問題に関連している可能性があります。
Webkit変換translate3d後に失われたcss z-index
しかし、提案された解決策は機能しません。また、rotate3d を使用して x 座標を変更し、一種の疑似 z-index オーバーレイに騙して遊んでみましたが、これもうまく機能していないようです。
アニメーションの終了後に Safari に z-index を保持させるにはどうすればよいですか?