transform
(or backface-visibility: hidden;
)とposition: absolute;
組み合わせて中の画像にimg {width:100%}
かつheight
指定しないとsafariで消える。img {width:100%}
と書いたけど、多分画像のwidth
かheight
どちらか片方だけcss側から%指定してやるのがダメな気がする。
更に、裏表両方にリンクを指定して負degでtransform: rotateY()
すると、裏面が表示されている時クリッカブルエリアが半分になる。
何を言っているのか全くわからないと思うから、以下サンプル。
画像が消える件に関しては、height: auto;
を書かなかったのが悪いだけだが、そういうこともあるんだよと。
クリッカブルエリアが半分になる件は、正degで回せばいいわけだが、クライアントに逆回転がいいと言われると死ぬ。
rotateY
以外はまだ試していないため、お暇な方は検証してみては。