I have a webpage with a crop box to edit an image. On a normal webpage, you can grab a corner or edge of the crop box with the mouse cursor and drag it around. However, on mobile devices (e.g., Iphone, Ipad), I am unable to grab the crop box as the screen only accepts taps (akin to mouse click) and the touch and slide resizes the webpage instead of dragging the crop box.

Is there a way to code this programmatically so that the crop box (border or corner) can be grabbed with a fingertip and dragged to resize the cropbox?

This must be possible because I saw something about the jQuery slider using HTML5 (type=range) to allow a touch and drag motion. Does anyone know the base code to allow this and how I could implement?

I found this other link, which is definitely headed it the right direction. However, there is no discussion and it looks like the author stopped work on it about a year ago. As it is, it is a bit tough to work with as I am completely new to mobile web development and relatively new to jQuery ...