Is there a function that makes an image not clickable so that the default chrome widget doesn't-CodePudding

Is there a function that makes an image not clickable so that the default chrome widget doesn't appear and allow them to download the image??

CodePudding user response：

You could just add it onto a canvas which makes the image unclickable:

HTML

<canvas id="myCanvas">
<img id="image"src='https://upload.wikimedia.org/wikipedia/commons/thumb/e/e0/SNice.svg/220px-SNice.svg.png'>

Javascript

window.onload = function() {
  var c = document.getElementById("myCanvas");
  var ctx = c.getContext("2d");
  var img = document.getElementById("image");
  ctx.drawImage(img, 10, 10);
};

CodePudding user response：

CSS

body {
-webkit-user-select: none;  /* Chrome all / Safari all */
-moz-user-select: none;     /* Firefox all */
-ms-user-select: none;      /* IE 10  */
-o-user-select: none;
user-select: none;
}

<script>
document.addEventListener('contextmenu', event => event.preventDefault());
</script>

HTML

<body oncontextmenu="return false;">