纯js+c3动画实现3D动画翻转（翻书效果）

Mr.王征

于 2019-02-15 16:11:39 发布

阅读量3.9k

点赞数 5

CC 4.0 BY-SA版权

分类专栏： HTML5 CSS 文章标签： css

本文链接：https://blog.youkuaiyun.com/wangzhneg123/article/details/87367917

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>3D动画翻转</title>
    <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
    <style>
        .book {
            width:460px;
            height:300px;
            position:relative;
            margin:10px 300px;
            -webkit-transform-style:preserve-3d;
            -moz-transform-style:preserve-3d;
            -ms-transform-style:preserve-3d;
            transform-style:preserve-3d;
            transform:rotatex(30deg);
        }
        .page {
            width:230px;
            height:300px;
            border:1px