为 jQuery Mobile 下载未缩小版本的 CSS 文件，并复制您想要的特定过渡的类.

Download the non-minified version of the CSS file for jQuery Mobile and copy out the classes for the specific transitions you want.

CSS 可以在这里找到:http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.css

The CSS can be found here: http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.css

过渡代码从第 1270 行开始.如果您复制所有用于过渡的 CSS 类，它只有大约 6KB 的信息.

And the code for transitions starts at line 1270. If you copy-out all of the CSS classes for transitions, it's only about 6KB of info.

以下是来自上述 CSS 文件的一些示例代码:

Here is some example code from the above CSS file:

.viewport-flip {
    -webkit-perspective: 1000;
    position: absolute;
}

.ui-mobile-viewport-transitioning,
.ui-mobile-viewport-transitioning .ui-page {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.flip {
    -webkit-animation-duration: .65s;
    -webkit-backface-visibility:hidden;
    -webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
}

.flip.out {
    -webkit-transform: rotateY(-180deg) scale(.8);
    -webkit-animation-name: flipouttoleft;
}

.flip.in {
    -webkit-transform: rotateY(0) scale(1);
    -webkit-animation-name: flipinfromleft;
}

因此，要翻转元素，您需要添加 .flip 类和 .in 类，而要翻转元素，您需要添加 .flip 类和 .out 类.

So to flip-in an element you would add the .flip class and the .in class, and to flip-out an element you would add the .flip class and the .out class.

此外，jQuery CSS 仅包含 -webkit- 前缀，但如果您想支持更多浏览器，您可以添加其他前缀，例如:-moz-、-o- 等

Also the jQuery CSS only includes -webkit- prefixes but if you want to support more browsers you can add other prefixes like: -moz-, -o-, etc.