unlock.js 介绍
unlock.js是一款jQuery滑动解锁 插件 。目前很多网站在 用户 登录 和 注册 时,为防止恶意攻击,采用来滑动解锁的验证方式。 用户 需要滑动指定的滑块到指定位置,才能通过验证。unlock.js可以实现这种滑动解锁 功能 。?
unlock.js特点:
滑动解锁。
尺寸、颜色、字体大小等都可以个性化定制。
完成解锁后会有回调 函数 ,用来触发进一步的数据处理。
?
unlock.js使用:
1、引入
<link href="path/to/css/unlock.css" rel="stylesheet">
<script src='path/to/js/unlock.js'></script>
2、html
<!--滑块容器-->
<div id = "foo"></div>
3、初始化
var $container = $('#foo');
$container.slid eto Unlock(options);
4、配置参数
参数
默 认值
描述
width
默 认为容器的宽度
滑块的宽度
height
默 认为容器的高度
滑块的高度
bgColor
#E8E8E8
滑块的背景颜色
progressColor
#FFE97F
progress的颜色
handleColor
#fff
滑块手柄的颜色
succColor
#78D02E
成功解锁后的颜色
text
'slide to unlock'
滑块上的 默 认 文字
textColor
#000
文字 的颜色
succText
'ok!'
成功解锁后 显示 的 文字
succTextColor
#000
成功解锁后 显示 的 文字 颜色
succFunc
function() { alert('successfully unlock!'); }
成功解锁后的回调 函数
网站地址 : https://github.com/menthe/unlock.js
GitHub: https://github.com/menthe/unlock.js
网站描述: 一款jQuery滑动解锁 插件
unlock.js官方网站
官方网站: https://github.com/menthe/unlock.js
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。