JavaScript

jQueryを使って右クリックを禁止させる方法

記事内に商品プロモーションを含む場合があります

クライアントワークで写真家のホームページを作ることになりました。ホームページで使用されている写真画像をダウンロードできなくするように右クリックをできなくして欲しいとの要望がありました。

正直、右クリックを禁止にしても、さまざまな方法で画像ファイルをダウンロードできてしまうのですが、まぁ一応ということで・・・

さて、jQueryで右クリックを禁止する方法ですが、以下のようなコードを書くだけで簡単に実現できます。

$(function(){
    $(document).on('contextmenu',function(e){
        return false;
    });
});

このように書くことで、閲覧してるページで右クリックメニューが表示されなくなります。

また、画像ファイル上でのみ右クリックメニューを禁止したい場合は以下のように書き換えます。

$(function(){
    $('img').on('contextmenu',function(e){
        return false;
    });
});

セレクタにimgタグを指定するだけです。

以上、jQueryを使って右クリックを禁止する方法でした。

===

コレカラウェブではWebライティングのお仕事を承っております。豊富な実務経験や国家資格を生かして、SEOに強い完全オリジナルな文章を作成いたします。公式noteにてポートフォリオを掲載していますので、こちらも併せてご覧ください。ご相談・ご依頼はお問い合わせページからお願いいたします!

「いいね!」と思ったら、クリックお願いいたします<m(__)m>
にほんブログ村 小遣いブログ Webライター・ブログライターへ にほんブログ村 IT技術ブログ SEO・SEMへ にほんブログ村 小遣いブログ ブログアフィリエイトへ
ABOUT ME
らぐち
コレカラブログ管理人のらぐちです。コレカラウェブという屋号でフリーランスとして、Webライティング・SEOコンサルティング・メディア運営・障害者支援のお仕事を一貫して承ってきました。このブログではコレカラウェブのお仕事で得たノウハウやテクニックを詳しく紹介しています。

COMMENT

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA