使網站成爲一個真正的立方體

我最近發現CSS/JS動畫，像MENY：http://github.com/hakimel/meny 事情是，它不僅使一個側面成爲關閉屏幕。我的目標是製作一個完整的立方體網站。使網站成爲一個真正的立方體

的想法：我使用的技術創建基於WEB技術的本地應用程序。爲了讓事情看起來真棒，我想實現3D動畫。事情是，我不想誇大我的主要觀點 - 所以我想到實際上有五六個，取決於多大的可能性 - 面孔。想象一下，Meny的所有四個選項都被激活 - 頂部，底部，左側，右側。因此，當用戶將他們的跑步者移動到頂部或任何其他側面時，他們將看到其中一個單獨的面部。最下面的一個會放一個小小的控制檯窗口。左側將進行搜索。右側會顯示一些信息和觸發器，並顯示實際菜單的頂部。中心，始終可見的臉部，將保存動態加載的內容。所以這樣我就可以使用側面來觸發主面的AJAX調用。

我怎樣才能實現這樣的動畫立方體狀的設計？第六面，在正面的背面，可能是一個更詳細的控制檯版本，有實際的輸入和諸如......終端等等。

我使用的桌面技術是appJS。它不支持3D，所以Illt ry不同的技術。我在Safari中調試接口本身。

來源

2013-05-26 Ingwie Phoenix

與每個臉上流露出不同版本的頁面瀏覽器立方體？看看three.js - http://threejs.org/。這是一個webgl庫。下面是一個例子，其中有人在場景中的飛機上實現了html - http://stemkoski.github.io/Three.js/CSS3D.html。 – Nile

看起來很有趣，但也很複雜o.o;但是，我會密切關注它。如果沒有別的可以幫助的話，不知怎的，這個......用這個......。 –

這應該不是太難的事與CSS 3D tranforms。看看這些：

http://desandro.github.io/3dtransforms/docs/cube.html

而且演示：

http://desandro.github.io/3dtransforms/examples/cube-02-show-sides.html

來源

2013-05-27 01:04:39 silverwind

超級有趣！試着將其應用到body並使用Meny的方法在鼠標指針掃描特定區域時自動旋轉多維數據集。謝謝！ –

好吧，我按照這個例子走了，然後用最後的演示來製作它的副本。現在我的立方體確實旋轉了......但它的腸道增加了。 [代碼]（https://gist.github.com/IngwiePhoenix/30afe0160fe0eb61d1bf） –

使網站成爲一個真正的立方體

回答

相關問題