Q&A
iPad向けの簡単なWEBアプリケーションを作っています。
カードの画像をタップで、1秒かけて裏返しになるアプリケーションです。
iOS8から10までは正常に動いていたのですが、
iOS11の端末では、アニメーションがちらつきます。
ちらつくというよりは、1秒かからずにパッと裏側の画像が表示される感じです。
どなたか解決、回避方法をご存知ではないでしょうか？
ご教授頂けますと幸いです。
コードは下記の通りです。
表のカード
css
1-webkit-backface-visibility: hidden; 2 backface-visibility: hidden; 3-webkit-transition: -webkit-transform 1s; 4 transition: transform 1s;
裏のカード
css
1-webkit-backface-visibility: hidden; 2 backface-visibility: hidden; 3-webkit-transition: -webkit-transform 1s; 4 transition: transform 1s; 5-webkit-transform: rotate3d(0,1,0,-180deg); 6 transform: rotate3d(0,1,0,-180deg);
を初期値とし、
タップされると、
表のカード
css
1-webkit-transform: rotate3d(0,1,0,-180deg); 2 transform: rotate3d(0,1,0,-180deg);
裏のカード
css
1-webkit-transform: rotate3d(0,1,0,0); 2 transform: rotate3d(0,1,0,0);
とすることで、カードの裏表を行なっています。
あなたの回答
tips
プレビュー
