伪3D全景H5（类淘宝造物节邀请函）

占坑，慢慢填

Plugins：

css3d-engine: https://github.com/shrekshrek/css3d-engine
orienter: https://github.com/shrekshrek/orienter
jstween: https://github.com/shrekshrek/jstween
bone: https://github.com/shrekshrek/bone
zepto / jQuery
不得不说 Shrek.Wang 真的是 github 高产
参考源码：KFC

Let's Start

在开始动手之前，先认真（适当）了解一下以上 Plugins的用法和功能
首先创建一个 html文件，

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <meta name="viewport" content="user-scalable=0" />
        <meta name="apple-mobile-web-app-capable" content="yes"/>
        <script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
        <script src="libs/bone-master/bone.min.js"></script>
        <script src="libs/css3d-engine-master/css3d.min.js"></script>
        <script src="libs/orienter-master/orienter.min.js"></script>
        <script src="libs/jstween-master/jstween.min.js"></script>
    </head>
    <body>
        <div id="main"></div>
    </body>
</html>

然后可以直接把 KFC 源码中的 model.js gesture.js pano.js main.js全部先拷贝过来这样开发效率会更快一些，如果全部自己动手写的话有些换算的部分就够你喝一壶的了。。。如果想全部自己动手的话可以先研究下 KFC源码

根据项目需求修改main.js的init部分代码创建主舞台和精灵

等待更新

Preview

⬇️扫描下方二维码预览作品：