css - 用于 3d 转换的 javascript 库

Question

我在浏览器中创建了 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);
}

您可以在此处查看此示例。

但现在它只适用于 chrome，我想让它更跨浏览器。任何人都可以建议一些用于 3d 转换的 javascript 库吗？有没有办法转换图像和文本？

Answer 1

这是一个css3效果的插件

效果

请将此作为注释阅读： 注意（其他浏览器）

Answer 2

如您所见，您提到的“transit.js”提供了不如 3d 快的 2d 转换（因为 GPU 支持 translate3d(...) 而不是 translate(..)）

原始图片网址 - http://pix.academ.org/img/2015/05/21/64bcd912c0851604977d73c7d1f82778.png