模仿手机图形解锁（原创）

Html

Css

默认密码：0-1-2

canvas {
	border:solid 1px #BCBBBB;
}

//没有封装，有兴趣的自行搞。
//配置
var state = false; //设置密码模式
var setbtn = document.querySelector('button');
var p = [];
var pswd = [0, 1, 2]; //密码
var tmp_pw = []; //
var down = false,
    msp = {
        x: 0,
        y: 0
    };
var c = document.querySelector('canvas');
var ct = c.getContext('2d');

}
c.onmouseup = function() {
    down = false;
    if (state) {
        state = false;
    } else {
        if (pswd.toString() == tmp_pw.toString()) {
            alert('正确');
        } else {
            alert('错误');
        }
    }

}
c.onmousemove = function(e) {
    //drawUI();
    if (down) {
        for (var i = 0; i < p.length; i++) {
            if (Math.abs(e.layerX - p[i].x) <= 16 && Math.abs(e.layerY - p[i].y) <= 16) {
                p[i].s = 1;
                if (state) {
                    pswd[i] = i;
                }
                tmp_pw[i] = i;
                drawUI();
            } else {
                // p[i].s=0;
            }
        }
    }
}
setbtn.onclick = function() {
    if (this.innerHTML == '设置') {
        this.innerHTML = '完成';
        init();
        setPW();
    } else {
        this.innerHTML = '设置';
        init();
    }
}

↑上面代码改变，会自动显示代码结果 jQuery调用版本：1.11.3

立即下载

模仿手机图形解锁（原创）

代码描述：模仿手机图形解锁，可以自定义密码。

模仿手机图形解锁，可以自定义密码。

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

PROMULGATOR

Apns

相关代码