<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="keywords" content="jQuery滑动验证,jQuery解锁" />
<meta name="description" content="unlock.js是一款滑动结算插件，本文讲解了插件的配置参数。jQuery滑动到底部解锁表单验证是表单中常用到的一种验证来防止恶意攻击。" />
<title>演示：jQuery演示四种不同的滑动解锁</title>
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/demo.css">
<link rel="stylesheet" type="text/css" href="assets/less/unlock.css">
<style>
.wrapper {
padding: 1rem 10%;
margin: 2rem auto;
min-width: 300px;
max-width: 1200px;
width: 70%;
}
.bar {
margin: 20px;
height: 40px;
width: 300px;
}
</style>
</head>
<body>
<div class="container">
<div class="row main">
<div class="col-md-12">
<h2 class="top_title"><span class="glyphicon glyphicon-menu-left" aria-hidden="true"></span><a href="http://www.sucaihuo.com/js/1638.html">jQuery滑动解锁</a></h2>
<div class="row" style="margin-top: 30px">
<div class="bar1 bar"></div>
<div class="bar2 bar"></div>
<div class="bar3 bar"></div>
<div class="bar4 bar"></div>
</div>
<script src="js/jquery.js" type="text/javascript"></script>
<script src='assets/js/unlock.js'></script>
<script type="text/javascript">
$('.bar1').slideToUnlock();
$('.bar2').slideToUnlock({
height: 50,
width: 200,
});
$('.bar3').slideToUnlock({
text: '未解锁的文字',
succText: '解锁成功的文字'
});
$('.bar4').slideToUnlock({
bgColor: '#fce',
progressColor: '#f60',
succColor: '#f00',
textColor: '#fff',
succTextColor: '#fff',
});
</script>
</div>
</div>
<footer>
<p>Powered by sucaihuo.com 允许转载、修改和使用本站的DEMO，但请注明出处：<a href="http://www.sucaihuo.com">www.sucaihuo.com</a></p>
</footer>
</div>
</body>
</html>
unlock.js演示四种不同的滑动解锁.zip
版权申诉
122 浏览量
2023-09-21
00:00:56
上传
评论
收藏 44KB ZIP 举报
unlock.js演示四种不同的滑动解锁.zip （10个子文件） 
assets js 
unlock.js 5KB less unlock.css 563B unlock.less 438B js jquery.js 99KB css demo.css 2KB
index.html 3KB fonts icomoon.woff 1KB
icomoon.svg 2KB icomoon.eot 2KB icomoon.ttf 1KB资源评论
