Webの記録

右クリックで独自メニューを出して画像のコピーガード

投稿日:2011年5月2日 更新日:

この記事は約 4 分で読めます。

画像のコピーガードを3通り試しています。

今回は「右クリックで独自メニューを出す」方法を試してみました。

右クリック禁止で画像のコピーガード」、
透明画像を置いて画像をコピーガードする。」も良かったらご覧ください。

今回は、右クリックで独自メニューを表示させる為に、jQueryの「ContextMenu plugin」ライブラリを利用します。



設置方法。

  1. jquery.contextmenu.r2.jsをダウンロード
  2. html記述。
  3. 試しにdemoを作ってみました。


1.jquery.contextmenu.r2.jsをダウンロード

「jquery.contextmenu.r2.js」をダウンロードしておきます。
※参考http://www.trendskitchens.co.nz/jquery/contextmenu/

さて、下準備はオシマイ。
ここから、htmlファイルに記述していきます。

2.html記述。

ここからheaderの中。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.contextmenu.r2.js"></script>
<script type="text/javascript">
	$(function(){
		$(document).contextMenu("menu", {});
	});
</script>

そして・・・bodyの中。
ただし、id名は上記のcontextMenuメソッドの第1引数の名前と一致させないといけないです。(今回はmenu)

<div id="menu" class="contextMenu">
<ul>
	<li><a href="nemu1.html">menu1</a></li>
	<li><a href="nemu2.html">menu2</a></li>
</ul>
</div>
<!-- /#menu -->


3.試しにdemoを作ってみました。

・・・で、実際に試してみました。【右クリックで独自メニューを出して画像のコピーガードdemo
デモ画面が開けたら、画面内で右クリックしてみてください。

画面を右クリックした時のイメージ

画面を右クリックすると、liの中のメニューだけが表示されました。
画像の保存をする表示が右クリックに出ないので、一応画像のコピーガード対策になるかもしれません。(完全にガードは出来ない・・・けれど)
しかし、右クリックで表示するモノを工夫するとなかなか面白いかも・・・と思えました。

【画像コピーガードの関連記事】

-Webの記録
-, , ,

執筆者:


comment

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

This blog is kept spam free by WP-SpamFree.

関連記事

no image

【jQuery】PCとiPhone,iPad,Androidを判別してページを切り替え(リダイレクト)したいとき

この記事は約 2 分で読めます。 以前はPCだけを意識してWebサイトを制作してきました。 しかし、最近はだんたんとPC以外(iPhone,iPad,Android)のタブレット系端末のアクセスが増え …

no image

WordPress 複数のサイドバーを使い分ける方法。

この記事は約 2 分で読めます。 WordPressのテーマを独自で作っていて、どのページも同じサイドバーでは面白くないなぁと思い…。 記事のページ(index.phpやsingle.php等)と固定 …

no image

無料で高機能なメールフォーム「メールフォームプロCGI」を設置してみた

この記事は約 1 分で読めます。 通常の静的なWebサイトにお問い合せフォームをつける時、自分でCGIを用意しないといけない場合、いろいろ探すのに大変でした。。。 無料でなら尚更・・・で、広告とか入っ …

no image

初心者のアクセス解析勉強メモ【用語と簡単にサイトをチェックしてみた】

この記事は約 1 分で読めます。 最近、興味があるのは・・・アクセス解析関係。 Webサイトを作った後、運営していくのにはやっぱり重要!アクセス解析をして、そのサイトの現在の状態を見て、それから目標を …

no image

苦手なJavaScriptをイチから勉強してみる【関数編】

この記事は約 1 分で読めます。 苦手なJavaScriptをイチから勉強してみる【イベント編】の続きとしてメモします。 イチから「JavaScript」を学び直しをする為に記録を残しています。少しず …