CODEWITHSUNDEEP
iphonejquery-uiios6
jose
jose

Reputation: 2543

iOS 6 magnifying glass click work-around

I'm using jQueryUI to drag some items from a list to another. For mobile, and specially, touch-driven devices, the user has to press and wait on a list item to start dragging - this is required because it does not disable the scrolling hability.

Now, with iOS 6.0 if the user keeps pressing the same list item the magnifying glass appears, which difficults the task of dragging.

Anyone know a (maybe) CSS or jQuery solution for this?

enter image description here

Thanks in advance.

Upvotes: 6

Views: 1992

Answers (1)

MLM
MLM

Reputation: 3688

The magnifying glass appears when selecting.

So add the usual cross browser user-select to your list items:

-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;

And for good measure add the touch-callout

-webkit-touch-callout: none;

Here is a demo: http://jsfiddle.net/MadLittleMods/3tzkc/

Upvotes: 6

Related Questions