画像上では右クリックメニューを出さない

[ IE4+(W), NN4(W), NN6, Mozilla ]

最近では右クリックの制御を許可しない設定がブラウザの機能として備わっていますし、さらにデフォルトだったりします。その意味で、Tipsとしてのこのページの存在意義は薄いです。ただ、方法を変えることでソースの利用価値があるかもしれませんので、もうしばらく残しておきたいと思います。-1/Feb/2006-

とかくこのような Tips は嫌われがちで、あまり有効でないということは承知しています。なので、おとなしめに…といってはナンですが、画像上でのみ制御するようにしておきました。^^;

画像上のクリックかどうかはスクリプト中で判断しています。まぁ、IMGタグの中で onmousedown=～として、個別に呼び出してやれば済むことなんですが…数が多かったりすると面倒な場合もあるでしょうし…ということで。

Opera6, MacIE, およびMacNN4.xに対しては無抵抗です。

【実行例】

このページにある画像の上で右クリックしても、コンテキストメニューは出ません。
左クリックは有効なので、２つ目の画像のようにリンクになっていても問題ありません。（※1）
少々イジワルですが、スクリプトOFFだと、３つ目の画像は見れません。エロくもなんともないので、隠す必要もないですが。

※1　NN4.7だと、リンクのある画像の上ではコンテキストメニューが出てしまします。

サンプルソース

HTMLドキュメントのお好きなところ（HEAD内が良いです）に、下記のコードをコピー＆ペーストすればOKです。また、このページのように外部ファイルとして利用したい方はこちらをどうぞ。→ nocontext.js

<script type="text/javascript">
<!--
function keepSilenceOnImg(e) {
  if(window.event) e=event;

  // 画像上のイベントかを判定
  var isIMG = false;
  if(e.srcElement) isIMG = (e.srcElement.tagName == "IMG");  // IE
  if(e.target)     isIMG = /Image/.test(String(e.target));   // NN,Moz
  if(isIMG) return false;
}
function disableContextOnImg(e) {
  if(window.event) e=event;

  // 画像上のイベントかを判定
  var isIMG = false;
  if(e.srcElement) isIMG = (e.srcElement.tagName == "IMG");  // IE
  if(e.target)     isIMG = /Image/.test(String(e.target));   // NN,Moz
  if(!isIMG) return;

  disableMouseDrag(); // ドラッグを無効化

  // 右ボタンのクリックかを判定
  var btn = 0;
  if(e.which)  btn = e.which;   // for NN4
  if(e.button) btn = e.button;  // for IE,NN6,Moz
  if(btn < 2) return;

  return false;
}
function disableMouseDrag(){
  document.onmousemove = function(){ return false; };
}
function enableMouseDrag(){
  document.onmousemove = "";
}
// EventCapture-------------------------------------------------------
if(document.layers){
  document.captureEvents(Event.MOUSEDOWN);
  document.captureEvents(Event.MOUSEUP);
}
document.onmousedown = disableContextOnImg;
document.onmouseup = enableMouseDrag;
document.oncontextmenu = keepSilenceOnImg;
// -->
</script>

【 実行例 】

サンプルソース

【実行例】