我已經創建了三維的轉換樣品中瀏覽器的JavaScript庫:的3D轉換
<div id="wrapper">
<div id="cube">
<div id="top">TOP</div>
<div id="front">FRONT</div>
</div>
</div>
和CSS:
#cube div{
-webkit-transform-origin:50% 50% -150px;
-webkit-transition: -webkit-transform .3s linear;
border:1px solid black;
}
#cube:hover #top{
-webkit-transform: perspective(1000px) translate3d(0,0,-150px) rotate3d(1,0,0,0);
}
#cube:hover #front{
-webkit-transform: perspective(1000px) translate3d(0,0,-150px) rotate3d(1,0,0,-90deg);
}
#cube #top{
-webkit-transform: perspective(1000px) translate3d(0,0,-150px) rotate3d(1,0,0,90deg);
}
#cube #front{
-webkit-transform: perspective(1000px) translate3d(0,0,-150px) rotate3d(1,0,0,0);
}
你可以看到這個樣本here。
但現在它只適用於鉻,我想使它更交叉瀏覽。任何人都可以建議一些JavaScript庫的3D轉換?有沒有辦法改變圖像和文字?