Disable “save image” in iOS web application

Question

I want to disable the \"save image\" menu in mobile web applications that appears when you hold down a finger on an image. I tried the CSS properties:

-webki         


        

Answer 1

-webkit-touch-callout is working for me. I used it on the body instead of the img

Answer 2

Well one thing you could do is cover the image with a transparent <div> tag. This would prevent the user form "clicking" (touching) the image at all:

<div style="position:relative;">
  <img src="something.png">
  <div style="position:absolute;left:0px;top:0px;right:0px;bottom:0px;z-index:1000"></div>
</div>

Note that if you send images to the browser they can be saved. This is just a workaround, a minor annoyance for anyone who really wants the images. If you can view it, you can copy/steal it.

Answer 3

I believe in this case pointer-events is your friend. You can simply add:

<img src="path/to/image.png" style="pointer-events:none" alt="">

And you should be good to go.

Answer 4

nothing worked for me except of removing the long press gesture recogniser:

for (UIView *subView in self.webView.scrollView.subviews) {
    for (UIGestureRecognizer *recogniser in subView.gestureRecognizers) {
        if ([recogniser isKindOfClass:UILongPressGestureRecognizer.class]) {
            [subView removeGestureRecognizer:recogniser];
        }
    }
}