javascript - 变换 : rotateX in jquery . 动画函数

Question

我正在尝试使用 CSS 执行翻转效果。我怎样才能得到 -

变换:透视(1200px) rotateX(0deg)

来自

变换:透视(1200px) rotateX(90deg)

使用 jQuery 的 .animate() 函数？

我尝试使用 jQuery 2D Transformation Plugin 但没有成功。

Answer 1

使用原生 CSS。像这样:

.panel {
    transform: perspective(1200px) rotateX(0deg);
    transition: transform 0.5s linear;
    -webkit-transition: transform 0.5s linear;
}
.panel.flip {
    transform: perspective(1200px) rotateX(90deg);
}

然后只需切换类即可。