jCube_创建 3d 立方体的 jQuery 插件

项目综述

jCube只需添加一行js脚本就可以创建出一个可以拖动旋转的3d立方体。

jCube 创建 3d 立方体的 jQuery 插件项目简介

jCube只需添加一行js脚本就可以创建出一个可以拖动旋转的3d立方体。用法基本使用方法<head>
    <script src="jquery.min.js"></script>
    <script src="../dist/jCube.min.js"></script>
</head>

<body>
...

<div class="room">

</div>
...
<script>
    $(function(){
        $('.room').jCube({
            wallWidth:635,
            wallHeight:664,
            cube:{
                back:'a/back.jpg',
                front:'a/front.jpg',
                left:'a/left.jpg',
                right:'a/right.jpg',
                top:'#90c0c0',
                bottom:'#9f5d3b'
                },  perspectiveRate:1.21  });
           });
</script>
</body>配置项可用配置项墙纸宽度 wallWidth , 墙纸高度 wallHeight立方体背景配置 cube墙面附加物配置 attach立方体class名称 cubeClass视角调整比例 perspectiveRate默认配置{
    wallWidth: 300,
    wallHeight: 300,
    cube: {
        front: 'white',
        back: 'white',
        left: '#d3d3d3',
        right: '#d3d3d3',
        top: '#f3f3f3',
        bottom: '#ddd' },
    attach: {
        front: '',
        back: '',
        left: '',
        right: '',
        top: '',
        bottom: '' },
    cubeClass: 'room-cube',
    perspectiveRate: 1,
    viewLimit: {
        xMin: -15,
        xMax: 15,
        yMin: -360,
        yMax: 360 }
}详细请查看demo页面1-立方体