shakejs是一个摇一摇的东西

gitHub : https://github.com/alexgibson/shake.js

运用要领

<script src="shake.js"></script> //引入

初始化
var myShakeEvent = new Shake({
    threshold: 15, // 动摇阈值
    timeout: 1000 // 事宜发作频次，是可选值
});

最先监听
myShakeEvent.start();

绑定函数
window.addEventListener('shake', shakeEventDidOccur, false);
    function shakeEventDidOccur () {//回调函数
    alert('shake!');// do it;
}

正式内容

人人都晓得，h5供应了一个DeviceOrientation特征，这个特征，供应了两个事宜，分别是：deviceOrientation 方向上，deviceMotion 加快度上。并没有shake这个事宜，那就用到了自定义事宜这个东西了。先看看自定义事宜在shakejs中的代码

if (typeof document.CustomEvent === 'function') {
       this.event = new document.CustomEvent('shake', {//自定义事宜称号
           bubbles: true,//是不是冒泡
           cancelable: true//是不是能够住手捕捉
       });
} else if (typeof document.createEvent === 'function') {
       this.event = document.createEvent('Event');
       this.event.initEvent('shake', true, true);
} else {
       return false;
}

上面全部的代码，做了一个兼容性的处置惩罚。如许就定义了一个叫shake的事宜，返回一个事宜对象，放到了this.event中。

触发自定义事宜

if (timeDifference > this.options.timeout) {
       window.dispatchEvent(this.event);
       this.lastTime = new Date();
}

上面是满足频次后就出发自定义的事宜 dispatchEvent(this.event) 这就是触发事宜的要领。

自定义事宜相干材料：
http://davidwalsh.name/customevent
http://www.open-open.com/lib/view/open1342696614323.html

addEventListener的第二个参数

平常情况下 人人在运用addEventListener这个要领的时刻，在第二个参数上会运用一个要领，然则，还能够传入一个对象，而且对象中handleEvent为事宜处置惩罚函数，看看在shakejs中是怎样处置惩罚的

Shake.prototype.start = function () {
        this.reset();
        if (this.hasDeviceMotion) {
            alert(this)
            window.addEventListener('devicemotion', this, false);
        }
    };

上面是实行start以后，来监听，devicemotion，而第二个参数是个this，也就是shake对象，那末来看看shake对象中有没有handleEvent这个事宜呢，往下面找，最后面 果然有，是如许的，

Shake.prototype.handleEvent = function (e) {
        if (typeof (this[e.type]) === 'function') {
            return this[e.type](e); //实行
        }
    };

这里的e.type就是上面监听的devicemotion事宜，而在shake中又有如许名字的一个函数，return 这句也就实行了这个函数。

好了 关于更多的关于自定义事宜和这个摇一摇模块的信息，能够看这篇内里供应的材料，或许直接翻看github项目地点。感谢。