jquery完成手勢解鎖源碼
發表時間:2023-12-27 來源:明輝站整理相關軟件相關文章人氣:
[摘要]手勢解鎖對于我們來說肯定是很常見的,用jquery實現的手勢解鎖見過嘛~免費提供源碼哦~~拿去研究吧~~代碼:<!DOCTYPE html><html><head><meta charset="UTF-8"><title&g...
手勢解鎖對于我們來說肯定是很常見的,用
jquery實現的
手勢解鎖見過嘛~免費提供
源碼哦~~拿去研究吧~~

代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>PHP中文網</title>
</head>
<body>
正確的密碼是一個字母“Z”的形狀哦!
<div id="gesturepwd"></div>
</body>
<script src="http://www.jq22.com/demo/jQueryGesturePassword20161102/jquery-2.1.4.min.js"></script>
<script src="http://www.jq22.com/demo/jQueryGesturePassword20161102/src/jquery.gesture.password.js"></script>
<!--<script src="../dist/js/danmuplayer.min.js"></script>-->
<script>
$("#gesturepwd").GesturePasswd({
backgroundColor:"#252736", //背景色
color:"#FFFFFF", //主要的控件顏色
roundRadii:25, //大圓點的半徑
pointRadii:6, //大圓點被選中時顯示的圓心的半徑
space:30, //大圓點之間的間隙
width:240, //整個組件的寬度
height:240, //整個組件的高度
lineColor:"#00aec7", //用戶劃出線條的顏色
zindex :100 //整個組件的css z-index屬性
});
$("#gesturepwd").on("hasPasswd",function(e,passwd){
var result;
if(passwd == "1235789"){
result=true;
}
else {
result=false;
}
if(result == true){
$("#gesturepwd").trigger("passwdRight");
setTimeout(function(){
//密碼驗證正確后的其他操作,打開新的頁面等。。。
alert("密碼正確!")
},500); //延遲半秒以照顧視覺效果
}
else{
$("#gesturepwd").trigger("passwdWrong");
//密碼驗證錯誤后的其他操作。。。
}
});
</script>
</html>
免費拿去研究吧!更多好的源碼盡在PHP中文網,關注我們給你好看哦~
相關推薦:
css實現會動的貓臉
原生js實現下拉列表框
js原聲實現簡單的微信聊天功能
以上就是jquery實現手勢解鎖源碼的詳細內容,更多請關注php中文網其它相關文章!
網站建設是一個廣義的術語,涵蓋了許多不同的技能和學科中所使用的生產和維護的網站。