Mobile device drawing and JavaScript unlocking with pure javascript code

Mobile device drawing and JavaScript unlocking with pure javascript code

There is a screen-Unlocking app on mobile phone devices, which is familiar to everyone. on mobile devices, users can lock the device's user interface by setting a lock pattern as a password, shows the locking interface.

As shown below

JavaScript Code

<Script> $ ("# gesturepwd "). gesturePasswd ({backgroundColor: "#2980B9", // background color: "# FFFFFF", // main control color roundRadii: 50, // radius of the Grand Circle pointRadii: 12, // The center radius of the center displayed when the circle is selected: 60, // The gap width between the circle points: 480, // The width of the entire component height: 480, // lineColor of the entire component: "# ECF0F1", // The zindex: 100 // css z-index attribute of the entire component }); $ ("# gesturepwd "). on ("hasPasswd", function (e, passwd) {var result; if (passwd = "1235789") {result = true;} else {Result = false;} if (result = true) {$ ("# gesturepwd "). trigger ("passwdRight"); setTimeout (function () {// other operations after the password is verified correctly, open a new page, and so on... Alert ("Pattern is correct")}, 500); // wait for half a second to take care of visual effects} else {$ ("# gesturepwd "). trigger ("passwdWrong"); // other actions after incorrect password verification... }}); </Script>

The above code is also very simple, just JavaScript code to unlock mobile devices, of course, this is the core code, other users also need to play according to their own needs. I hope this article will help you.