Reputation: 13555
Default keeping tap on the screen (eg. hold tap for 1 second) will show a option of save image / copy. However , I would like to turn off that function for my web app , is it possible? I have tried to replace the event of touchmove to selectall , however it does not work . Thanks for helping.
addEventListener('touchmove', function(e) { e.preventDefault(); }, true);
Upvotes: 5
Views: 3385
Reputation: 2429
I thought it would be worth mentioning that you can do this with pure CSS. It's probably not a really great idea, because neither IE10 or Opera Mobile support it. But it can be done, and in the future, this would probably be a better way than with JavaScript. Or if you're only talking about iPhones and iPads, this method would work really well. Here's an example on CodePen.
The code is simple:
.notouch {
pointer-events: none;
}
Just give the class of notouch
to any image that you want to effect.
If you want to do it to every image on the page, do this:
img {
pointer-events: none;
}
And I should give an obligatory speech on useability. By doing this you're overriding default functionality that people expect to be there all the time. It makes for a really bad experience for you to turn off something like this, unless you have a really, really good reason to do so. So please, make sure you do.
Edit:
To get rid of the magnifying glass, use this code:
.notouch {
pointer-events: none;
-webkit-user-select:none;
}
With -webkit-user-select
set to 'none' you may not even need to turn off pointer events, but I'm not sure about that. I updated the CodePen as well.
Upvotes: 3
Reputation: 2859
It could be beneficial to disable not only preventDefault, but other properties as well:
e.preventDefault();
e.cancelBubble = true;
e.returnValue = false;
return false;
Also the event, are you sure it's touchmove ?
Upvotes: 4