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

WordPressプラグイン「PhotoDropper」でフリー画像を記事にラクラク挿入♪

この記事は約 1 分で読めます。 photo credit: Remedios205 文字だらけの記事。ちょっと読むのがツライですね。。。 でも、イメージ画像がナイ!そんな時に使えそうなプラグインを探 …

no image

クリッカプルマップをjQueryでレスポンシブ対応させる方法

この記事は約 1 分で読めます。 滅多に使わないのですが、たま~に「クリッカプルマップ」を使用してコーディングをする事があります。 しかし、「クリッカプルマップ」はレスポンシブで使用してしまうと、リン …

no image

WordPressでオリジナルテーマ作りにチャレンジ5【sidebar.php編】

この記事は約 1 分で読めます。 WordPressのオリジナルテーマ作りにチャレンジしています。 今回は、「sidebar.php」の部分を作りたいと思います。 私が作りたいオリジナルテーマの「si …

no image

別窓でリンク先のページをポップアップで開きたいとき

この記事は約 1 分で読めます。 よくリンク設定で、「target=”_blank”」を入れて別タブで開くようにすることは多いですが・・・。 今回、たまたまポップアップでリンク …

no image

WordPress ソーシャルブックマークのボタンを付けてみた

この記事は約 1 分で読めます。 何気によく見掛けるTwitterやFacebookなど、ソーシャルブックマークのボタン。 1つ1つ設定するのは、面倒なのでまとめて複数のサービスのボタンを簡単に取り付 …