html5案例——【梦想有理，幻想无界】

今天分享的HTML5案例是来自163的【梦想有理，幻想无界】专题
    效果图：

    


    专题特色：

    1、一开始的模拟指纹识别的效果，通过获取手指按屏幕的时间来做动画，专题核心源码：

    它这里是通过监听touchstart和touchend，中间给个计时器，超过一定时间就触发后面动画。

    2、里面有一屏是需要“举起手机”才能进入下一步动画，这个挺有创意的，通过计算手机的屏幕垂直旋转来实现，专题核心代码：

    3、最后一个交互“亲TA一下”，其实不用真的用嘴去亲屏幕，用两个手指触屏也会触发。通过监控触屏的，专题核心代码：

    二维码：

    


    看到别人做出来的效果，通过分析一下，获取和学习自己认为好的东西，下次在自己遇到这个需求时可以快速上手，这也是一种高效学习方法喔！更多HTNL5案例 http://www.w3cmark.com/html5/