一款简单实用的jQuery拖动滑块滑动验证插件,可以通过传参的方式修改滑块的CSS样式,可以传入滑动成功后再执行的方法。一个页面可以生成多个滑动验证。
js代码
<script src="jquery.min.js"></script>
<script src="Sliding_Validation_Gu.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var sliding_validation = SlidingValidation.create($('body'),{},function(){});
/**
*参数1 —— 在传入的元素的结尾插入-obj
*/
/**
*参数2 —— 修改滑动验证的样式-{"key":"value"}
* position: "relative", 滑动验证的定位
top: "0px", 滑动验证的top值
left: "0px", 滑动验证的left值
slide_block_wrapper_width: "300px", 滑动验证的宽度
slide_block_wrapper_height: "40px", 滑动验证的高度
slide_block_width: "50px", 滑动块的宽度
slide_block_height: "100%", 滑动块的高度
margin: "0px 0px 0px 0px", 滑动验证的marigin
slider_wrapper_zindex: 10000, 滑动验证的z-index
slider_wrapper_bg: "#e8e8e8", 滑动验证的背景颜色
slider_bg: "rgb(255,255,255)", 滑块的背景颜色
progress_bg: "rgb(255,184,0)", 滑动进度的背景颜色
default_text: "请向右滑动滑块", 滑动区域的文字
default_text_color: "black", 滑动文字的默认颜色
success_text_color: "white", 成功后滑动文字的颜色
default_text_font_size: "12px", 滑动文字的文字大小
success_show_text: "验证成功", 验证成功后滑动文字的内容
success_slider_wrapper_bg: "rgb(76,175,80)", 滑动成功后 滑动进度的背景颜色
success_url_icon: "sliding_block_image/ok.png", 滑动成功后滑块上面的图片 url地址
default_url_icon: "sliding_block_image/right-arrow.png", 默认滑块上面的url地址
box_shadow: "1px 1px 5px rgba(0,0,0,0.2)", 滑动验证的阴影
border: "1px solid #ccc" 滑块的border
*/
/**
*参数3 —— 滑动验证成功之后执行的方法-function(){}
*/
</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791