沿Z-軸旋轉在HTML5 - 倒裝卡

Question

我只是碰到一個簡單的Flash動畫來翻轉卡上
The Playing Card Effect
該卡具有2個圖像「正面」形象和「回」的形象，
當點擊該卡沿着Z軸旋轉切換
相應地顯示正面和背面。

使用HTML5/Canvas/CSS3可以達到同樣的效果嗎？

PS：對於HTML5和CSS3的東西，我是完整的新手/新手。

感謝所有

Answer 1

It's possible using CSS3 with Javascript

當旋轉使得它如此的卡顯示其背後，圖形切換到「背面」的圖形。否則，將圖像src設置爲正面圖形。

您也可以使用setTransform與html5 canvas上下文歪斜。或者你可以採取緩慢的路線並手動操作像素數據。

Answer 2

這不是一個答案，但我看到了什麼，我相信你在談論提交表單這裏的特色後實施完成：http://sublimevideo.net/

很多自己的CSS和JS是模糊的，但是從我可以收集它看起來像他們通過JS類交換機使用webkit轉換。它非常流暢，實際上令我驚訝的是它看起來有多驚人。希望有些來源可以幫助你。