Ajax Fancy Captcha - jQuery plugin

Drag and Drop Captcha Demo

 

What is it:

Ajax Fancy Captcha is a jQuery plugin that helps you protect your web pages from bots and spammers. We are introducing you to a new, intuitive way of completing “verify humanity” tasks. In order to do that you are asked to drag and drop specified item into a circle.

Captcha’s security level is medium, with the emphasis on nice looking and user friendly qualities while still offering reasonable protection from unwanted “guests”. Basic design and its elements are easy to change and customize (take a look at file structure for more information).
If you have any ideas, comment or just want to say hello, please do - any feedback will be greatly appreciated.

Update for September 2009:

  • reduced size,
  • easier integration,
  • easy translate,
  • few common problems fixed.

File structure:

-captcha
–imgs
–captcha.css
–jquery.captcha.js
–captcha.php
–iepngfix.htc
-latest-jquery
-latest-jquery-ui
-example.html
-readme.txt

How it works:

It calls captcha.php file and gets a random number. Php file just generates simple number and put it in session. When AJAX got that number it creates items based on that number. Lets imagine that we have array of “pencil”, “scissors”, “clock”, “heart”, “note”, so if number 3 is returned it will take “heart” and look for item-heart.png file in /imgs directory.

How to install:

1. As usual, copy /captcha folder somewhere in your hosting.
2. If you don’t have latest jquery and jquery.ui integrated already, copy these two folders.
3. Edit page where you want to put captcha and insert:

1. <!-- Begin of captcha -->
2. <div class="ajax-fc-container"></div>
3. <!-- End of captcha -->

Put this in header of your page

1. <script type="text/javascript" charset="utf-8">
2. $(function() {
3. $(".ajax-fc-container").captcha({formId: "myForm"});
4. });
5. </script>

Default Options:


1. borderColor: "",
2. captchaDir: "captcha",
3. url: "captcha/captcha.php",
4. formId: "myForm",
5. text: "Verify that you are a human,
drag scissors into the circle.”,
6. items: Array(”pencil”, “scissors”, “clock”, “heart”, “note”)

Dependencies:

Download:

Please note, if you downloaded files to your computer it won’t work properly unless you start it through web server since it uses AJAX requests.

Links:

Staying up to date:

If you like Ajax Fancy Captcha, please subscribe to RSS and you will receive latest info.

Tags: , , ,

Share/Save/Bookmark

159 Responses to “Ajax Fancy Captcha - jQuery plugin”


  1. Shalini Says:

    I tried the script, but see a weird behavior. I get the images in the array.. though the image that should be dragged does not appear. Instead the default image of item-none(the book) appears. Can you please help?

    The script is surely impressive and a visual treat.


  2. Vladimir Says:

    Hi Shalini,
    if all of items are books, something is wrong with path to imgs/ folder. Do you see five different pictures on captcha ? If you didn’t find the answer please post address to your website where you want to put captcha so we can check what’s wrong …


  3. philip Says:

    I’m sorry, I’m not trying to be snarky, but how is a CAPTCHA that is dependent on JS helping?


  4. Vladimir Says:

    As long as i know captcha isn’t dependent neigher on script side nor script language. If you take closer look at definitions, you won’t find anything related to that and even if i’m wrong, all positive changes are welcome, aren’t they?
    However, we tried to make something fresh in this area because you can see lots of boring and worth less captchas all over the web. On the other hand Ajax Fancy Captcha uses ajax request to set correct answer in php session to protect your pages. I don’t see anything bad in that, actually all that presents is simple, friendly, nice-looking and safe way of form security.


  5. foresth Says:

    Hello Vladimir,

    It’s a really nice work! Original and beautiful..


  6. apaella Says:

    Simple snippet to hack your code.
    The random number is requested by javascript, stored by javascript and passed by javascript so javascript always knows the answer :D

    Great design!

    $($(’.ajax-fc-highlighted’).attr(”class”).split(” “)).each(function(index, item){
    var form = $(’.'+item).parents().filter(”form”)
    item = item.split(”-”);
    if(item.length == 3 && item[0] == ‘ajax’ && item[1] == ‘fc’){
    if(item[2]/1+” === item[2]+”){
    $(form).append(”");
    $(form).find(”#submit”).click();
    }
    }
    })


  7. Vladimir Says:

    Hi Apaella,

    we are aware that captcha has medium security level and we are trying to figure out how to make it more secure.
    If you have idea please post them here :)


  8. Mario Says:

    Unfortunately your script isn’t unobstrusive. When a users has javascript deactivated he can’t submit the form. Ok this has not directly something to do with your plugin, but you should consider including an example, that includes a “fallback” captcha.


  9. Gis Says:

    Hi,

    nice Script but I recommend to use quotes in PHP arrays to avoid PHP Error Notices :)


  10. Razvan Pavel Says:

    cool idea. too bad from an accessibility point of view it’s a total fail, not to mention the users with no JS support


  11. gerard Says:

    It’s great!
    I think that could be better adding de drag property to all elements and assign de same cursor, but it’s really cool!


  12. Wellington Gasparin Says:

    It’s nice, much better than read “stranges” captcha. But, I found a problem with this one… If the person were blind?


  13. Jason Says:

    Great idea. Works great on a limited range of user agents.

    But I just tested on the iPhone and it doesn’t work.

    If someone could make this accessible and interoperable it would be much much better.


  14. deviantz Says:

    thanks! cool fancy captcha!


  15. Kyle Says:

    Conceptually I think it is a GREAT idea. It looks good and it’s easy to use. The only down fall is what others have already mentioned. If JS is turned off, the form is unusable. There needs to be some type of old school server side fall back CAPTCHA that will take it’s place.

    It’s definitely an awesome start, but I am really looking forward to seeing the next phase or version of it!


  16. Glenn Says:

    I am wrong to think that anyone implementing this could easily deal with JS being turned off? Could you not just check, if it is on then use this. If JS is not enabled, use another method.

    Nice idea and implementation. I’ll play with it for sure.


  17. Vladimir Says:

    Hi all,

    thanks for helping us to improve fancy captcha :)

    In next version you can expect support for users that don’t have JavaScript and more improvemants regarding security and skinning.


  18. W0utR Says:

    Very nice and cool way to replace the basic captcha.

    Realy awesome


  19. Ravi Vora Says:

    Love it.


  20. Frank Says:

    aw poop… i guess i shouldn’t continue my project someday? haha… ur captcha is kinda what i was going for… http://www.phpbb.com/community/viewtopic.php?f=16&t=409809&p=2240207#p2240207


  21. desu Says:

    man this need to be ported as a wordpress plugin


  22. Robert K Says:

    Re: accessibility/vision-impaired issues - sure, seems like that would be a problem, but if you’re using jquery to create a rich AJAX web app, you’re likely to have that issue already.

    Re: Disabled JS - come on, if a user doesn’t have JS enabled nowadays, 90% of the web is going to be broken for them, not just this site.

    The main issue I see is the security. What’s to prevent a script from circumventing the drag-n-drop feature and just programatically taking the token from one of the five images and trying that? Sure, they’ll get it wrong 4-out-of-5 times, but a 20% success rate is probably more than acceptable in for most captcha hackers.


  23. Miles Tinsley Says:

    Yes… I agree. This as a Wordpress plugin would be the icing on the cake! Nice work…


  24. Vladimir Says:

    Hi,
    thank you for suggestion, the WP plugin has being developed. We hope that tomorrow or in two days it is going to be released. We will also think of security a little bit more … If you want to get info about new upgrades, please subscribe to our RSS.


  25. Sylvain Says:

    Great job…
    I’m using it, but I ‘ve the same problem Shalini : this always ask me for the item undisplayed. (I’m french, apology my English …)
    Example : pencil, scissors, clock, book and note are displayed. And the script ask me for heart …


  26. Pieter Beulque Says:

    Really, really awesome idea.

    Very good!


  27. M.A.Yoosuf Says:

    i am so impressed


  28. Nikola Says:

    Great idea! This is a very innovative approach to validation.


  29. gMinuses Says:

    “When AJAX got that number it creates items based on that number. ”

    I really think the number shouldn’t be revealed to the client. A spam could simply return the number to bypass the whole captcha, since it’s known to the client.

    Maybe you could just store the number in session and let the client guess what it is or what they are(drop multiple items to the drop zone) by telling the client what item(s) the server intended.

    Nice widget though. Really like the idea.

    Some people say it is unfriendly to a blind person. I’m not sure if “select then submit” not “drop then submit” will make it better.


  30. mj Says:

    bright idea… converting the captcha in more interactive way…


  31. daniel Says:

    looks nice, i tried it, but can’t get it to work. It actually shows the 5 different images, but it never shows the one that is asking for….

    i’m getting some weird behavior on the styling as well….

    i would also try to play with it so i can translate it to Spanish!

    thanx in advance…


  32. zombaio Says:

    Great, but not working! Everybody here has the same problem in NOT displaying the correct answer image. I`ll drop a post later if I figure out where is the exact bug.


  33. zombaio Says:

    Ok, fellows, I found it.
    and it seems like a typo..
    In the file captcha.php just change the line
    elseif(!$_POST[captcha])
    with
    elseif($_POST[captcha])
    and it will work.

    The trick is that ajax waits for a numeric response and captcha.php returns always “Failed!” , because of the session-check.

    If you want your php file clean .. rewrite it - there are missing brackets and quotas .. I prefer “strict” php files.

    So, everyone that says: JS knows the answer are right.. there is pretty better way to hide all this from the client. I`ll try to work on it, because I thing this captcha is good!
    and because I hate old captchas …
    :)


  34. daniel Says:

    Fixed! on jquery.captcha.js:

    var rand = $.ajax({ url: url,async: false }).responseText;
    var pic = randomNumber();
    $(”.ajax-fc-” + rand).html( “”);
    $(”p#ajax-fc-task span”).html(items[pic]);
    $(”.ajax-fc-” + rand).addClass(’ajax-fc-highlighted’);
    $(”.ajax-fc-” + rand).draggable({ containment: ‘#ajax-fc-content’ });

    replace pic in random….

    $(”.ajax-fc-” + pic).html( “”);
    $(”p#ajax-fc-task span”).html(items[pic]);
    $(”.ajax-fc-” + pic).addClass(’ajax-fc-highlighted’);
    $(”.ajax-fc-” + pic).draggable({ containment: ‘#ajax-fc-content’ });

    I still have to take a look on captcha.php, i think the session variable should be created before posting the form… but that shouldn’t be a problem…

    thanx!


  35. daniel Says:

    idiot, zombalo fix on captcha.php did it!


  36. Vladimir Says:

    Thank you zombaio and daniel, i did changes in captcha.php and it should work now. All your suggestions are always welcome.

    New file is uploaded.


  37. Divine CSS Says:

    This is an awesome captcha plugin! We love it at Divine CSS.


  38. Can Berkol Says:

    super cool!! :)


  39. heikki doeleman Says:

    Nice, but is there support for i18n ? I’d like to use it but it would need to use the language the user has selected for my site.


  40. sue Says:

    what a cute way ! ;)


  41. Derek Says:

    It’s not showing up on my wordpress site for some reason? Is there something I have to do?


  42. Vladimir Says:

    Hello Derek, can you please tell us link where did you implement it ?


  43. Derek Says:

    @Vlad http://i628.net/

    Its wordpress.


  44. Amit Says:

    Hi can just let me know in which directory i should copy
    ui.core.js
    ui.draggable.js
    ui.droppable.js
    The above file, also at my end, the item which has being told to drag is not visible. can you tell me what’s the problem.
    Thanks
    -Amit


  45. Vladimir Says:

    Hi Amit,
    you can put them in any directory just don’t forget to set path to that files. You have example to take a look included in this project . Thanks


  46. JnMik Says:

    Can’t seem to have it working.

    Here’s what in my header:

    var borderColor = “”;
    var captchaDir = “/captcha”;
    var url = captchaDir + “/captcha.php”;
    var formId = “FormComment”;
    var items = Array(”pencil”, “scissors”, “clock”, “heart”, “note”);

    $(function() {
    $(”.ajax-fc-container”).captcha();
    });

    and i’m having a javascript error when I’m trying to have it displayed with:

    1.
    2.
    3.

    The FormId is okay too. Path seems good.
    Any tips?

    thx


  47. Vladimir Says:

    what error do you receive ?


  48. Neal Says:

    It isn’t showing up on my WP blog. I installed it through the WP plug-ins page on my WP dashboard. Is there something else I need to do? Thank you!


  49. Arnaud Says:

    Hi,
    I would like to put your captcha on my website but I have the same problem as Neal.
    I put the folder in my wordpress plugin directory, then I activate it, I put correct path for captchaDir and “commentForm” for the Id of my form. I also put these 3 lines in my form :


    end I put correct path to the jquery “jquery-1.3.1.js” and “jquery-.ui.all.js”.
    When I go to my page, captcha is not displayed. Can you help me ? Thank you !


  50. ewuski Says:

    Hi,
    I really like your captcha. Nice idea and great design.
    I was thinking to use it on my website and I’ve tried it and it seems to be a bug: whenever a picture to pick up is on the first possition in the row it returns a ‘failed’ message.
    Suppose I am to pick up the heart and it falls on the first possition in the row - it gives ‘failed’ result. Any other possition is fine.


  51. Josko Gaberc Says:

    This is really an interesting approach to captcha, and I think new ideas are always welcome, but in my opinion it should be a little more secure. All in all great work!


  52. Johannes Peter Says:

    Hey, I want to add this to the Wordpress Registration screen to prevent bots from registering on my site.

    I have tried placing the code into either wp-login.php or wp-register.php (not sure which it should be), I set the
    captchaDir to myserver/wp-content/plugins/ajax-fancy-captcha
    and the formid to “registerform”, but it won’t work. I’m sure i’m probably making some stupid mistake somewhere, but it would be nice if you could tell me if the code should go somewhere else or I made any other mistake.

    Thanks a bunch.


  53. Pansy Says:

    Hi,

    I use this plugin with JQuery version 1.3.2. I don’t know why the image should be dragged does not appear in the image list. The image list also has 5 different pictures. Would you mind telling me how to fix this problem?


  54. John M Says:

    I install to my website but not working.

    var captchaDir = “/wp-content/plugins/ajax-fancy-captcha/”

    I should change this dir to full path ?
    Please advice.

    John M


  55. Khaled Says:

    Replace this code with the one in captcha.php:
    http://code-bin.homedns.org/272

    and edit the example page, line:
    var captchaDir = “/captcha”

    remove the / to be like:
    var captchaDir = “captcha”


  56. Manish MISTRY Says:

    Liked the idea! I think you need to add target=’_blank’ in the top right hand link “WDB fancy captcha” as when I click on the it in the example in the post body, it opens up the homepage in the same iframe!


  57. Thibow Says:

    Cool concept, design and developpement !
    But, how did you use this captcha if you desactive Javascript ? :-/

    But very good work !
    Freindly.

    Thib.


  58. Pat Says:

    Wouaw, this captcha is an awesome one !


  59. Lauri Lubi Says:

    I like the idea. I like the design. But the security…
    A bot can read a right answer from several places.
    * find element li with class ui-draggable
    * read the what we are looking for. eg note, scrissors. then find img with src = */item-object.png
    * if the above would fail, send 5 different answers to the server

    But I like the design.


  60. tobalito Says:

    hey Vladimir !

    nice work, nice design…

    but I have a problem…

    I can see all the icons except the one I have to drag in the “drop here” zone. Only this one is replaced by the default icon : the book…

    How can I fix this please ? I can’t find resources about this issue

    thanx in advance


  61. praveen Says:

    The best captcha ever :)


  62. woodie Says:

    hallo Vladimir.. Wow, it’s great stuff.. and great work.. thank you


  63. James Says:

    Thank you this will work great in my new site.
    Much better then trying to decode numbers a nd letters


  64. sgranit Says:

    Cool captcha, but it does not work in IE7 so unfortunately it is completely useless. Images/circle do not appear at all. Please fix it if possible…


  65. Vladimir Says:

    It isn’t related to browser type, you should check your implementation. IE7 works fine but i’ll try to write integration document in future. Please, provide us link for your website where did you pit captcha ?

    Thanks


  66. sgranit Says:

    Sorry Vladimir, it does work in IE7, the problem I was having earlier was related to browser settings in combination with some javascript errors on this webpage, http://www.webdesignbeach.com/beachbar/ajax-fancy-captcha-jquery-plugin

    IE7 reports that there is a javascript error on line 174. Set IE7 to “show a notification about every script error” to see it.


  67. Manish Sapkota Says:

    Cool captcha going to use it very soon.


  68. Adarsh K.P. Says:

    Reference to post number 1093, 1247 same problem comes in. Those for the image which is draggable item-none.png is displayed. Means the image to be dragged is missing and in place of that default image is shown.

    Please advice. This is a great find and interesting captcha compared to old boring style.


  69. xris Says:

    Hello! I will definitely try this!
    I’d just like to ask you, yousay that it has a medium security level, Why is this???
    What is it that this plugin is missing for being more secure?
    A ask this so we can help u think what to do to make it more secure.
    Thanx!


  70. Sanket Says:

    Thanks khaled its now workin


  71. David Moreen Says:

    It appears to not be working for me. Maybe it is my server maybe it just does not like me but I’m having issues.


  72. Frank Says:

    Excellent work, Vladimir!

    To those pointing out that this doesn’t work when Javascript is disabled, I’d challenge you to present your number of users who browse with Javascript disabled.

    Every current major browser comes with JS enabled by default, and most sites require it for the best browsing results.

    In almost 13 years of IT, the only users who I’ve seen turn it off are those geeky enough to implement something like this.

    I subscribe to the belief that requiring Javascript is no problem whatsoever, and have no reservations using something like this on my sites.


  73. Jeffrey Says:

    Lol.. I have uploaded the script, but just the picture you have to drag, istn in the list :P


  74. Web Design Mumbai Says:

    wow, this is so beautiful and creative


  75. Mark Says:

    Hi Vladimir,

    Like it! its so simple


  76. ppscan Says:

    What I like about this is it’s both novel and pleasing to the eye. You can’t help but love it.


  77. Daniel Witt Says:

    Hi,

    some improvements to make it more more localised

    I add a new Array for the text

    itemText : Array(”den Bleistift”, “die Schere”, “die Uhr”, “das Herz”, “die Note”)

    and replace that line

    $(”p#ajax-fc-task span”).html(options.itemText[pic]);

    So now I have the possibility to change the Text and make it localised and on the other hand it doesn’t attach the implementation for the icon include.

    I fix also one other problem that i have with my php installation. I _MUST_ add
    <?php at the beginning of the captcha.php otherwise the script doesn’t work because it returns an text block with the code of the php file.

    Many thank’s for that cool captcha,
    Daniel (from Germany)


  78. bernard Says:

    Great plugin - thanks for releasing this.

    However, it fails about 1 out of 10 times I try it, both locally and on your site (in the article above). After I move the image into the circle, I check if the mouseup event happened by trying to move the image again, so I’m sure it’s a problem with the script (rather than my mouse getting stuck or whatnot).


  79. bernard Says:

    (the above comment refers to Firefox 3 on Mac Os X. The error that occurs is a “Failed!” message appears after the correct object is placed in the center of the circle, about 1/10 times)

    Also, the script doesn’t work at all on Safari. Sometimes the response is “Failed!” when it should pass, and most of the time an int 0-4 is returned.


  80. Chirag Says:

    This is really cool, beats having to type in captchas like 5 times before you get it right


  81. bernard Says:

    OK - so the script appears to work on both FF and Safari, as long as there has not already been a “Passed!” result. If the user has already passed the captcha once, the page will need to be reloaded to ensure the script actually works. Otherwise, it’ll show “Failed!” randomly on FF and return an int on Safari.


  82. Thirteenth Says:

    Well, this captcha works for me, but if a pencil is required, it returns Failed! All other images work.


  83. Pedro Says:

    Let’s try


  84. jay Says:

    kool stuff :)


  85. SamsonDelila Says:

    Great work! I’ll use it for my website’s form contact.. Thx !


  86. BT Says:

    Sometimes, a picture is not displayed (the book takes place)

    Here the fix :

    for(var i=0, position = 0;i<5;i++)
    {
    if (i == pic) continue;
    if (position == rand) position++;

    $(”.ajax-fc-” +position).html( “”);
    used[i] = options.items[position];

    position++;
    }


  87. Ian Says:

    I got around the problem of it not working when the first item is selected by doing this:

    0 && $_POST['captcha'] == $_SESSION['captcha'])
    {
    print “OK”; /* YOUR CODE GOES HERE */
    unset($_SESSION[captcha]); /* this line makes session free, we recommend you to keep it */
    }
    elseif($_SERVER['REQUEST_METHOD'] == “POST” && $_POST['captcha'])
    {
    print “NOTOK”;
    }
    /* in case that form isn’t submitted this file will create a random number and save it in session */
    else
    {
    $rand = rand(0,4);
    $_SESSION['captcha'] = $rand;
    echo $rand;
    }
    ?>

    And oddly enough, the captcha below wanted me to use the first item … and now it’s showing the book in slot 1. See next message.


  88. Ian Says:

    Ignore previous, half the code got wiped. Here’s the full version:

    /*
    captcha.php
    jQuery Fancy Captcha
    http://www.webdesignbeach.com

    Created by Web Design Beach.
    Copyright 2009 Web Design Beach. All rights reserved.

    Modified by Ian to make it work when $rand = 0
    */
    session_start(); /* starts session to save generated random number */

    /* this compare captcha’s number from POST and SESSION */
    if($_SERVER['REQUEST_METHOD'] == “POST” && strlen($_POST['captcha']) > 0 && $_POST['captcha'] == $_SESSION['captcha'])
    {
    print “OK”; /* YOUR CODE GOES HERE */
    unset($_SESSION[captcha]); /* this line makes session free, we recommend you to keep it */
    }
    elseif($_SERVER['REQUEST_METHOD'] == “POST” && $_POST['captcha'])
    {
    print “NOTOK”;
    }
    /* in case that form isn’t submitted this file will create a random number and save it in session */
    else
    {
    $rand = rand(0,4);
    $_SESSION['captcha'] = $rand;
    echo $rand;
    }


  89. tdck Says:

    nice…


  90. GEORGE Says:

    NICE SCRIPT


  91. mohsen Says:

    thie is very useful good work


  92. Emer Says:

    I’m using it, but I ‘ve the same problem Shalini


  93. Internetforis Says:

    хороший скрипт однозначно! nice script! wery good!


  94. achmatim Says:

    great jquery plugin! thanks for sharing


  95. Edwin Says:

    Hellow,

    I’ve had the same problem with Shalini (Comment - 1093)

    I’ve loaded the page, and it’s said that drag note into the circle, but I saw only icons other than note, I tried to refreshed it, but the same problem occured, its said “drag scissor”, but scissor not available.

    Btw, great job, thanks a lot


  96. SkG Says:

    This is a really great captcha i love it!


  97. Rayhan Says:

    Nice, i’m downloaded the latest version. After try it in my site, sometimes the words with red highlight doesn’t match with the image.
    Ex. “Verify that you are a human,
    drag book into the circle.”
    But i don’t see any “book” image, 4 image can’t move it with mouse but we can move “pencil” to drag area.

    Then i tried to refresh the page, then that will works perfectly. When i reload again, that captcha doesn’t work.
    Please PM me if u answered this problems.

    Regards


  98. Rayhan Says:

    Ok, i’ve got another error again.
    Uploaded to you, hope u know where this bugs comes from :) cause i like this captcha style.

    http://i50.tinypic.com/2h88enq.jpg


  99. ali Says:

    very good


  100. Emadz Says:

    This is really great plugin for Captcha Entry


  101. Eli Says:

    Hi, I finally managed to install the CAPTCHA, and I was wondering what the random number is used for? I see that its for storing in sessions but is it necessary?

    Also, what are the licensing terms for this code?


  102. Francois Laforge Says:

    I have figured out Shalini’s problem (i had the same problem): don’t forget to include the ui.draggable.js and the ui.droppable.js in your page!

    (I just had to read the instructions a little more thoroughly.


  103. TechGeek Says:

    Okay, this is starting to really aggravate me. This just plain doesn’t work. I’ve made sure all of my paths are correct, all URL reference is perfect.
    1) The captcha box doesn’t even show up
    2) If you look at source code, everything should be there.
    Is there any help to be had for this?


  104. Dev Says:

    Its great..thank i’ll try it..


  105. Spread Drupal Says:

    Really its nice CAPTCHA


  106. Mbah Iyet Says:

    Very good!…thats great …i do like it, n i ll try to apply on my web…thanks…!


  107. Lee Says:

    It is good to see different options for captcha. I may give it a go.


  108. Karina Says:

    Hi Vladimir!

    Love the great work you’ve done!

    One question, is already supporting when you don’t have js activate in the browser?

    Thank you!


  109. rob Says:

    This is a great idea, but I just wasted a couple of hours trying to get it to work. It’s really buggy. I get that issue where the icon requested usually isn’t displayed, and when it actually does, if the requested icon is in the first position, it always fails.


  110. Vladimir Says:

    Thanks Rob,

    just checked and you were right, i’m going to fix the bug with first position very soon!


  111. ASHMAX Says:

    Will this now work without having javascript enabled and does it support all browsers?


  112. ASHMAX Says:

    Also is there anyway to remove “WDB fancy captcha” credits could go in the code!
    And would it be possible to use your own image icons?

    Thanks


  113. Sherman Owen Says:

    I have been testing your captcha using several browsers. I had an issue using jQuery to access the hidden input added to the form specified in the default override. I had to modify the file jquery.captcha.js
    find: name=\”captcha\” value=\”"
    and add after that ID=\”captcha\”
    this fixes the issue of composing my POST for my ajax using jQuery.
    before this repair the statement
    cap=$(”captcha”).val();
    always returns null.


  114. John Says:

    Excellent work, Can I use it on my website ? What are the terms and conditions? Can I remove the WDB fancy captcha > link while showing on my site?


  115. position(0) Says:

    1st position is a bug ??


  116. ASHMAX Says:

    Hi there is anyone answering our questions?


  117. ASHMAX Says:

    ??? Anybody ??? How long do you have to wait for an answer……its been weeks !!


  118. Luis Says:

    Hi There, is there a legal stuff regarding the use of this captcha??? I would like to use it at my company’s site. It is gorgeous!!!


  119. Milan Ajdinovic Says:

    Hi Luis,

    please just leave our signature on captcha and we are good


  120. Nicole Says:

    This looks awesome! Can’t wait to try it.


  121. jurex del socorro Says:

    very nice….


  122. Ash Says:

    Does not work in Chrome 4.0


  123. Jason Says:

    Nice!


  124. Naci Says:

    Great captcha dude!! =D

    I just used it for my friend’s web site, minor modifications for different languages.
    works great
    here’s the link:
    http://www.sophiasheridan.com/mx/contacto.php

    tyvm for sharing

    Ivan Cruz
    Navi Zurc


  125. Navi Says:

    I just tried it using
    chrome 4.1.249.1064 (45376)
    works fine


  126. Yarli Says:

    Will you be making this available as a Wordpress Plugin anytime soon?


  127. Vladimir Says:

    I’m going to re-test it in Chrome 4.0

    Regards.


  128. Dima Says:

    brilliant!


  129. Namila Says:

    thankz..its cool plugin ;)


  130. pkshops Says:

    Hello All,

    It’s a great effort indeed, I tested it on FF 3.0.19 and on IE 6.0. on IE it’s working fine but on FF images are not drag able.

    If anybody have same problem with the script, how you will fix it.

    you can see a much simple human-verification on my website. that is working on all browsers, no compatibility/accessibility issues at all. Please see the php comments system on pkshops.com. If anybody need that script, I am here to help.

    Thanks for creating this awesome ajax captcha script.


  131. Xpycm Says:

    Hello.
    If you use XAMPP and correct image not display replace <? with <?php in captcha.php file


  132. Matt Says:

    Isn’t it a little naive to store the answer to the captcha at the client.


  133. Andrew Says:

    It’s a nice idea, but I think it might be a bit weak. I don’t know much web stuff, but couldn’t someone easily write a javascript function to find the icon with the class “ui-draggable” (as only the correct one has dragging) and then post it’s number that back to your php and get in every time?

    Even without doing that 20% of bots won’t be captured, as they would simply happen to guess the right answer, wouldn’t they?

    Plus, on page resets it doesn’t seem to work, it took me 3 minutes to pos this comment because it kept thinking I dragged the wrong one.


  134. Matt Says:

    > It’s a nice idea, but I think it might be a bit weak. I don’t know much web stuff, but couldn’t someone easily write a javascript function to find the icon with the class “ui-draggable” (as only the correct one has dragging) and then post it’s number that back to your php and get in every time?

    This is certainly the case and can be bypassed in using easily using JS (and just as easily by a bot without access to the DOM)

    > Plus, on page resets it doesn’t seem to work, it took me 3 minutes to pos this comment because it kept thinking I dragged the wrong one.

    That could be because of the bug where the first position always fails (another comment further up shows a simple fix for this)


  135. Dave Says:

    It looks ok - I might try it!


  136. Patric Says:

    Damn cool and odd compared to them ordinary captchas. Goodie.


  137. Pål Hetland Says:

    Thanks for this! I will definitively use this.


  138. ddd Says:

    Прекарасно работает что-ли..


  139. yannick Says:

    Very nice plugin,great work.


  140. anil Says:

    how it install i can’t understand pls explain


  141. Mark Says:

    I really, really love the idea, and how nice looking and fun to use this captcha is.

    I’ve read all the comments - and most of them are for shure right.
    Before I try installing it - were the securitiy suggestions implemented or one should start hacking the code by himself?


  142. Hendrik Says:

    Hey Guys, please could you let me know where I can download the working version, because mine also does not display the image that you need to drag.

    Thanks in advance.


  143. Peter Says:

    Who cares about people with Javascript disabled? They should be shot. Screw them all.


  144. daists Says:

    very nice . thanks author .


  145. epitaph Says:

    If a draggable picture on the first position it does not work… looks like a bug…


  146. epitaph Says:

    The same problem is here … this is very buggy


  147. a Says:

    hi, it seems the left most image would always error, error means the captcha think it is a wrong answer, please correct this, thanks


  148. Mitch Fisher Says:

    I struggled a bit with this script. While everything did work the image that was supposed to be dragged was left as a book (meaning not found). The problem was the captcha.php file. The ‘rand(0,4)’ function was always returning 0. Changing to the ‘rand()’ function to ‘mt_rand(0,4)’ did the trick for me - that was the only change. I’m running PHP 5.3.2.


  149. Oliver Says:

    I like it BUT it throws a javascript error when I use the wordpress version with Internet Explorer. I even see errors when I come to this site. Whats the dealio?


  150. Hemalatha Says:

    Nice idea.I will surely try this…Cool


  151. Tony Says:

    Cool - But can software click and drag an onscreen image like a human can?


  152. cf4fun Says:

    Can anyone help with converting the captcha.php to captcha.cfm [coldFusion] I have tried to get help @ efreedom.com but nothing. Thank you.

    by the way this capthca is awesome


  153. Neeraj Says:

    Hi! It is good. But when we download your script via “Click here to download source code! (67kb)” it is not working. I mean it is showing 2 notebook icons. why not you try to download your scrapt via “Click here to download source code! (67kb)” and check that it is working properly or not. I am so sad. It is such a very good job but I am hopeless.. Keep R&D continue.
    Thanks


  154. James Says:

    Hi this is such a great Form Captcha. I have managed to set up the captcha on my form but I have Mootools form validation running. How can I tell my form to check that the form captcha has been completed before submitting? It seems to be overriding it. - Thanks for a great captcha!


  155. DEN 007 Says:

    It would be nice to make a multilanguage with automatic language detection, using this you can make a captcha even more convenient.

    Thank you, very good script!


  156. Vasiliy Ali-Baba Says:

    very close to concepts realized by KeyCAPTCHA.com except that this one is not protected against automatic engagement of 3d party human solver, by re-transmitting captcha to them. KeyCApTCHA solution considers this as well as many other vulnarabilities to bots. AFAIK, it is developed by former spambot developers


  157. Spelen Says:

    Definitively going to try this, looks very cool and very new to me to be honest!

    Great job, thanks for sharing.


  158. JKuiper Says:

    This is a great captcha, but I have still two questions.
    1. I’m controling my fields in javascript, before starting another phpscript to save my fields. But how do I check if the image is dropped?
    2. When there’s a error occured on one of the fields, the submit will be canceled. How do I reset the captcha with a new random set of images and no image dropped?


  159. alalawa Says:

    great plugin
    is it available as a wordpress plugin so that i can use it on my website…
    it really looks cool, an it is also upto web design level satisfaction
    since i am a web developer i truly love this

Leave a Reply