jQuery滑动图片角度插件(canvas简易仿baidu登录)

所属分类:输入-验证,拖和放

 14172  217  查看评论 (0)
分享到微信朋友圈
X
jQuery滑动图片角度插件(canvas简易仿baidu登录) ie兼容9

更新时间:2019-11-05 23:56:08

jqRotateVerify

使用

var myRotateVerify = new RotateVerify('#rotateWrap', {
    initText: '滑动将图片转正', //默认
    slideImage: ['image/1.jpg', 'image/2.jpg', 'image/4.jpg'], //arr  [imgsrc1,imgsrc2] 或者str 'imgsrc1'
    slideAreaNum: 10, // 误差范围角度 +- 10(默认)
    getSuccessState: function(res) { //验证通过 返回  true;
        console.log('例1' + res);
    }
})

参数

- initText  :'滑动将图片转正',//默认

-  slideImage :图片的src,可以为一个图片的src,也可以是多张图片的 src 数组 

- slideAreaNum:10,// 误差范围角度 +- 10(默认)

- getSuccessState:验证成功回调  返回true

重置方法

//重置 
$("#resetBtn").on('click',function(){
    myRotateVerify.resetSlide();
})

获取验证状态

//可拿到 验证状态 
$("#testBtn").on('click',function(){
    alert(myRotateVerify.verifyState);
})

html

<div id="rotateWrap" style="margin-top:50px;">

</div>
<div style="text-align: center;margin-top: 50px;">
    <button type="button" id="resetBtn" style="height: 30px;">重置</button>
    <button type="button" id="testBtn" style="height: 30px;">状态测试</button>
</div


相关插件-验证,拖和放

输入框内容验证插件jquery.input.rule.js

这是一个文本框内容限制的方法,可以把用户输入的信息进行分类,然后进行判断,如果不符合,则提示错误。
  验证
 35289  330

级联依赖/验证

用于angularjs实现
  验证
 30133  329

jQueryCSS3分步骤注册表单切换动画在线演示

jQueryCSS3分步骤注册表单切换动画在线演示
  验证
 43531  478

简单易懂的jQuery表单验证插件

这是一款简单易懂的表单验证插件,没用使用任何多余的代码,使用时仅需引用jquery和jquery.validate.js
  验证
 33490  336

讨论这个项目(0)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复