I am currently exploring web apps for iOS devices and use PhoneGap to create a "native" application out of it. The problem I have with this is the magnifying glass, that I don't want to be shown when selecting paragraphs (or bit of text). I have tried a lot of solutions but nether works. I use this CSS to disable all copy, selection and such for those fields I wan't:
*[untouchable] {
-webkit-user-drag: none;
-webkit-user-modify: none;
-webkit-highlight: none;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}
This works fine, but it still shows the magnifer/loupe when I touch and hold on text:
Is there a real solution to this? It would be awesome with a simple CSS property such like -webkit-magnifier: none
or something like that. If there's a JavaScript solution, that would be fine too, but maybe a overkill.
Since I am using PhoneGap and it uses UIWebView to show the page, there might be a way of disabling the magnifier for that - but I haven't looked that much into the native source.
Thanks in advance :-)