Mastering jQuery UI

Creating the number CAPTCHA

So far, we have seen two examples with draggable, droppable, and slider. For our last implementation, we will use the sortable component of jQuery UI.

We will generate a five-digit number on the server side and display it to the user. Then, we will display five digits of the same numbers in random order and ask the user to arrange them using sortables to make the original number. However, this time there will be a difference in how we display the original number. Instead of printing the five-digit number directly on the screen, we will display it as an image. To do this, we will need an image of all 10 digits from zero to nine. This can be created as a single sprite of 10 images. We will then create five div elements, ...