hammer.js又一款比较牛逼的手势插件

所属分类:选择类

 5753次|    1次   点击收藏(1)

hammer.js又一款比较牛逼的手势插件

我在这里只是简单的介绍一下用法,感兴趣的同学可以查看演示,然后用手机扫一扫!测试一下!


我们引入如下js


        <script src="https://hammerjs.github.io/dist/hammer.js"></script>
定义一个文本可以旋转触发的div

   <style>
            #myElement {
                background: silver;
                height: 300px;
                text-align: center;
                font: 30px/300px Helvetica, Arial, sans-serif;
            }
        </style>
        <div id="myElement"></div>
事件书写如下:


  var myElement = document.getElementById('myElement');

            var mc = new Hammer.Manager(myElement);

// create a pinch and rotate recognizer
// these require 2 pointers
            var pinch = new Hammer.Pinch();
            var rotate = new Hammer.Rotate();

// we want to detect both the same time
            pinch.recognizeWith(rotate);

// add to the Manager
            mc.add([pinch, rotate]);


            mc.on("pinch rotate", function (ev) {
                myElement.textContent += ev.type + " ";
            });

这样,当我们旋转pinch或者rotate的时候,都可以触发文本!

关于前端资源库

前端资源库是haorooms博主平时积累的前端资源,大部分来源于互联网。但经过博主调试和加工,集聚了博主的心血。

因此,资源库所有资源,仅供学习和参考,切勿下载下来用于商业用途或者转卖。转载请注明来自haorooms博客资源库!

联系方式
关键词搜索