Tips, News and Comments on HTML Guard


August 12th, 2009, by Andreas

Disabling the Context Menu in Firefox

Firefox offers an easy way to circumvent the anti-right click script that I presented to you in a previous article. All one has to do is go to the “Advanced JavaScript Settings” (Tools > Options > Content > Advanced) and deselect the “Disable or replace context menus” option.

Firefox - Disable or replace context menus

However, there is no need to panic. There is a simple solution to this problem. By stopping the propagation of the “oncontextmenu” event with the .stopPropagation() method, the context menu can be blocked even with “Disable or replace context menus” remaining unchecked:

function onContextMenu(e) {
  if (e && e.stopPropagation)
    e.stopPropagation();
 
document.oncontextmenu = onContextMenu;

When merging the above code into the original anti-right click script, we get the following:

<script language="JavaScript" type="text/javascript">
<!--
 
  // Setting "onlyOnImages" to "true" will disable right-clicking only for
  // images
  var onlyOnImages = false;
 
  // Detect the browser we have to handle with
  var isIE5 = document.all && document.getElementById;  // IE 5 or higher
  var isMoz = !isIE5 && document.getElementById;  // Mozilla/Firefox
 
  function cancelContextMenu(e) {
    // Here you can add additional code that is executed when the context menu
    // is blocked. For instance you can use the following code to display a
    // message to the user:
    //alert("Please respect our copyright. Thank you!");
 
    if (e && e.stopPropagation)
      e.stopPropagation();
 
    return false;
  }
 
  /* This function is fired every time a user clicks the right mouse button to
     open the browser's context menu. */
  function onContextMenu(e) {
    // Depending on the "onlyOnImages" variable the context menu is either
    // blocked for the complete page or only for <img> tags.
    if (!onlyOnImages
      || (isIE5 && event.srcElement.tagName == "IMG")
      || (IsMoz && e.target.tagName == "IMG")) {
      return cancelContextMenu(e);
    }
  }
 
  if (document.getElementById) {
    // Register event handler
    document.oncontextmenu = onContextMenu;
  }
 
-->
</script>

A sample page is available here.

Tags: ,
Posted in Code Examples