On right click event

sasimca007

Hello friends,
I want to bulid a page that is restricted with right click. That means, any where on page right click is restricted. How to do that?
If possible help me with the code?

Rsmastermind

Use this friend this will work for u
<html><body oncontextmenu="return false;" >

sasimca007

Will you please excuse me that
can you please give me full code with an example please my friend , i am poor at javascript.

Rsmastermind

Ok friend you ahve to do nothing just write in the body tag oncontextmenu="return false;". If you will return true then it will enable the right click.

like this for example .This is full code .You ac save this with .html extension and see that right click is disabled

[HTML]<html><body oncontextmenu="return false;" >
<td><span>Action</span></td>
<td><select id="combo1" name="combo1" size="1" class="optional" >
<option value="condition 1">Proceed</option>
<option value="condition 2">Reject</option></select></td>

<td><span>No Action</span></td>
<td><select id="combo2" name="combo2" size="1" class="optional" >
<option value="condition 1">Proceed</option>
<option value="condition 2">Reject</option></select></td>
<td><input type="file" id ="attachment"/></td>
</body></html>[/HTML]

sasimca007

Hi friend,
sorry it is allowing the right click on the page. It displays two select boxes and a file box. But it allowing the right click on the page. I want disallow right click on total page.

acoder

The first question to ask yourself is why you even need this script. If it's to protect the source code or images, forget it. It's annoying and the users who do want access can easily work around your little script. For images, watermark them instead.

If you must, you can use the right click detection script described here.

Rsmastermind

Please can you please let me know about the Internet Explorer or browser's information like
version and name because it is working fine in my environment i.e with IE 6thversion.

crocodilu2008

In order to deal whith right click you must overide the context menu

Expand|Select|Wrap|Line Numbers

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

  "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">

<!-- 

     Example File From "JavaScript and DHTML Cookbook"

     Published by O'Reilly & Associates

     Copyright 2003 Danny Goodman

-->

<html>

<head>

<title>Recipe 10.7</title>

<style rel="stylesheet" id="mainStyle" type="text/css">

html {background-color:#cccccc}

body {background-color:#eeeeee; font-family:Tahoma,Arial,Helvetica,sans-serif; font-size:12px;

    margin-left:15%; margin-right:15%; border:3px groove darkred; padding:15px}

h1 {text-align:right; font-size:1.5em; font-weight:bold}

h2 {text-align:left; font-size:1.1em; font-weight:bold; text-decoration:underline}

.buttons {margin-top:10px}
 
</style>

<style type="text/css">

.contextMenus {position:absolute; background-color:#cfcfcf; 

              border-style:solid; border-width:1px; 

              border-color:#EFEFEF #505050 #505050 #EFEFEF; 

              visibility:hidden}

.menuItem {cursor:pointer; font-size:9pt; 

           font-family:Arial, Helvetica, sans-serif; 

           padding-left:5px; color:black; 

           background-color:transparent; 

           text-decoration:none}

.menuItemOn {cursor:pointer; font-size:9pt; 

             font-family:Arial, Helvetica, sans-serif; 

             padding-left:5px; color:red; 

             background-color:yellow; 

             text-decoration:underline}

.contextEntry {font-weight:bold; color:darkred; cursor:pointer}

</style>
 
<script type="text/javascript">

// context menu data objects

var cMenu = new Object();

cMenu["lookup1"] = {menuID:"contextMenu1", hrefs:["http://www.m-w.com/cgi-bin/dictionary?book=Dictionary&va=sesquipedalian","http://www.m-w.com/cgi-bin/dictionary?book=Thesaurus&va=sesquipedalian"]};

cMenu["lookup2"] = {menuID:"contextMenu2", hrefs:["http://www.wyomingtourism.org/","http://www.pbs.org/weta/thewest/places/states/wyoming/","http://cnn.looksmart.com/r_search?l&izch&pin=020821x36b42f8a561537f36a1&qc=&col=cnni&qm=0&st=1&nh=10&rf=1&venue=all&keyword=&qp=&search=0&key=wyoming","http://google.com","http://search.yahoo.com"]};
 
// position and display context menu

function showContextMenu(evt) {

    // hide any existing menu just in case

    hideContextMenus();

    evt = (evt) ? evt : ((event) ? event : null);

    if (evt) {

        var elem = (evt.target) ? evt.target : evt.srcElement;

         if (elem.nodeType == 3) {

            elem = elem.parentNode;

        }

        if (elem.className == "contextEntry") {

            var menu = document.getElementById(cMenu[elem.id].menuID);

            // turn on IE mouse capture

            if (menu.setCapture) {

                menu.setCapture();

            }

            // position menu at mouse event location

            var left, top;

            if (evt.pageX) {

                left = evt.pageX;

                top = evt.pageY;

            } else if (evt.offsetX || evt.offsetY) {

                left = evt.offsetX;

                top = evt.offsetY;

            } else if (evt.clientX) {

                left = evt.clientX;

                top = evt.clientY;

            }

            menu.style.left = left + "px";

            menu.style.top = top + "px";

            menu.style.visibility = "visible";

            if (evt.preventDefault) {

                evt.preventDefault();

            }

            evt.returnValue = false;

        }

    }

}
 
// retrieve URL from cMenu object related to chosen item

function getHref(tdElem) {

    var div = tdElem.parentNode.parentNode.parentNode.parentNode;

    var index = tdElem.parentNode.rowIndex;

    for (var i in cMenu) {

        if (cMenu[i].menuID == div.id) {

            return cMenu[i].hrefs[index];    

        }

    }

    return "";

}
 
// navigate to chosen menu item

function execMenu(evt) {

    evt = (evt) ? evt : ((event) ? event : null);

    if (evt) {

        var elem = (evt.target) ? evt.target : evt.srcElement;

        if (elem.nodeType == 3) {

            elem = elem.parentNode;

        }

        if (elem.className == "menuItemOn") {

            location.href = getHref(elem);

        }

        hideContextMenus();

    }

}
 
// hide all context menus

function hideContextMenus() {

    if (document.releaseCapture) {

        // turn off IE mouse event capture

        document.releaseCapture();

    }

    for (var i in cMenu) {

        var div = document.getElementById(cMenu[i].menuID)

        div.style.visibility = "hidden";

    }

}
 
// rollover highlights of context menu items

function toggleHighlight(evt) {

    evt = (evt) ? evt : ((event) ? event : null);

    if (evt) {

        var elem = (evt.target) ? evt.target : evt.srcElement;

        if (elem.nodeType == 3) {

            elem = elem.parentNode;

        }

        if (elem.className.indexOf("menuItem") != -1) {

            elem.className = (evt.type == "mouseover") ? "menuItemOn" : "menuItem";

        }

    }

}
 
// set tooltips for menu-capable and lesser browsers

function setContextTitles() {

    var cMenuReady = (document.body.addEventListener || typeof document.oncontextmenu != "undefined")

    var spans = document.body.getElementsByTagName("span");

    for (var i = 0; i < spans.length; i++) {

        if (spans[i].className == "contextEntry") {

            if (cMenuReady) {

                var menuAction = (navigator.userAgent.indexOf("Mac") != -1) ? "Click and hold " : "Right click ";

                spans[i].title = menuAction + "to view relevant links"

            } else {

                spans[i].title = "Relevant links available with other browsers (IE5+/Windows, Netscape 6+)."

                spans[i].style.cursor = "default";

            }

        }

    }

}
 
// bind events and initialize tooltips

function initContextMenus() {

    if (document.body.addEventListener) {

        // W3C DOM event model

        document.body.addEventListener("contextmenu", showContextMenu, true);

        document.body.addEventListener("click", hideContextMenus, true);

    } else {

        // IE event model

        document.body.oncontextmenu = showContextMenu;

    }

    // set intelligent tooltips

    setContextTitles();

}
 
</script>

</head>

<body onload="initContextMenus()">

<h1>Custom Contextual Menu</h1>

<hr /> 
 
<p>This sentence has at least one <span id="lookup1" class="contextEntry">sesquipedalian</span> word

and mention of the state of <span id="lookup2" class="contextEntry">Wyoming</span>, both of which could have additional lookups.</p>
 
<div id="contextMenu1" class="contextMenus" onclick="hideContextMenus()" onmouseup="execMenu(event)" onmouseover="toggleHighlight(event)" onmouseout="toggleHighlight(event)">

<table><tbody>

<tr><td class="menuItem">Merriam-Webster Dictionary</td></tr>

<tr><td class="menuItem">Merriam-Webster Thesaurus</td></tr>

</tbody></table>

</div>
 
<div id="contextMenu2" class="contextMenus" onclick="hideContextMenus()" onmouseup="execMenu(event)" onmouseover="toggleHighlight(event)" onmouseout="toggleHighlight(event)">

<table><tbody>

<tr><td class="menuItem">Wyoming Tourist Info</td></tr>

<tr><td class="menuItem">State Map</td></tr>

<tr><td class="menuItem">cnn.com</td></tr>

<tr><td class="menuItem">Google</td></tr>

<tr><td class="menuItem">Yahoo Search</td></tr>

</tbody></table>

</div>
 
</body>

</html>