問題描述

試實現(xiàn)下面的動效：

粉紅色的線是輔助線。

問題看似簡單，其實要覆蓋全面還是不太容易的?！灸硞€CSS3屬性】其實是不兼容IE的哦，所以用javascript來實現(xiàn)也是歡迎的答案～

問題解答

最簡單的方案是通過transform-style: preserve-3d;來做，這樣只需要搭好各個面，變換容器就可以了。

http://jsfiddle.net/cLhofbh6/

可惜IE始終不支持這個屬性。此外的方案會比較痛苦，需要針對三個面做旋轉(zhuǎn)，還要保證轉(zhuǎn)軸一致。