jQuery UI Slider Captcha using Range slider

I was searching for jquery slider captcha code last days (16/11/2013). I found some but they weren´t so easy to include and handle. I have decide to build my own to implement to my web sites for testing.

How it works

How it works? We use jQuery UI range slider and save some datas to SESSIONs. The point of this captcha system is not only to move sliders for exact numbers but after moving sliders some security characters are adding with jquery into the captcha field.

This was technical part of this captcha script. Let me explain the logic (if there is some :D):

First security part is to store random numbers and MIN MAX values into the image wich is created dynamicly. The user has to move sliders for correct MIN and MAX value. Second is that jQuery funcion adds special security characters into the input after we move sliders. If the numbers are set correctly we compare data stored at the beggining with datas send from POST value (crypted). To compare the special characters we use saved salt and crypt function to crypt them and compare datas with $_SESSIONs. If all - numbers, crypted special characters and honeypot field are set correct the form passed without error. The point is that bot have no clue how we crypt the data so all HTML data and data from the image are not able to use to send the form.

Hope the second version of the script is much secure now. Thank you all for comments ;).

Live DEMO

Move sliders for red numbers:  

Here is what you need

DOWNLOAD SOURCE CODE Last edit: 16/12/2013



Comments

1 2 3
Total: 30    Page:
Avatar picture

jou   |   08.06.2017/15:38

jou

Avatar picture

pepe   |   27.03.2017/14:39

pepep

Avatar picture

jojo   |   21.02.2017/23:19

this is jojo

Avatar picture

tester   |   17.02.2017/13:54

test

Avatar picture

12   |   17.01.2017/19:01

12

Avatar picture

dsfsdf   |   12.01.2017/12:13

dfsdfsdf

Avatar picture

test   |   06.01.2017/22:10

toto je test

Avatar picture

gfdfg   |   02.01.2017/07:04

dfgdfg

Avatar picture

demo1   |   13.12.2016/10:12

this is test action

Avatar picture

me   |   28.09.2016/23:53

test

1 2 3

Nick:

Comment:

Move sliders for red numbers: