html滑动验证,html5移动端按住滑块拖动验证代码

特效描述：html5移动端 按住滑块拖动 拖动验证代码。js html5适用于移动端的按住滑块拖动验证成功效果代码。请用手机打开查看演示

代码结构

1. 引入CSS

2. 引入JS

3. HTML代码

请在移动端查看效果pc端无法拖拽

还原

验证结果：

还原

验证结果：

var btn1 = document.getElementById("btn1");

var btn2 = document.getElementById("btn2");

var result1 = document.getElementById("result1");

var result2 = document.getElementById("result2");

var slider1 = new FtSlider({

id: "slider1",

callback: function(res) {

result1.innerHTML = res;

}

});

var slider2 = new FtSlider({

id: "slider2",

width: 320,

height: 36,

textMsg: "拖动滑块到右边",

successMsg: "验证成功了哦",

callback: function(res) {

result2.innerHTML = res;

}

});

btn1.onclick = function() {

slider1.restore();

result1.innerHTML = "false";

}

btn2.onclick = function() {

slider2.restore();

result2.innerHTML = "false";

}