見出し画像

Webサイトに掲載した画像を右クリックで保存できなくする。

shinpei 
<!DOCTYPE html>
<html>
<head>
<style>
  img {
    user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -ms-user-select: none;
  }
</style>
<script>
  document.addEventListener("DOMContentLoaded", function() {
    document.querySelectorAll("img").forEach(function(img) {
      img.addEventListener("contextmenu", function(e) {
        e.preventDefault();
        alert("画像コピー禁止");
      });
    });
  });
</script>
</head>
<body>
  <!-- 以下に画像を挿入してください -->
  <img src="your-image-source.jpg" alt="サンプル画像">
</body>
</html>

このコードは、画像を右クリックしてもコンテキストメニューが表示されないようにし、代わりにアラートで「画像コピー禁止」と表示されます。

ただし、この方法は完全な保護ではありません。特に技術的な知識を持つユーザーや開発者ツールを使える人には、画像を他の方法でコピーすることが可能です。そのため、これはあくまで一般的なユーザーに対する軽度の防止策とお考え下さい。

この記事が気に入ったらサポートをしてみませんか？