A context menu event is not a new event in the world of browsers,however it is very less known event. In this tutorial we will explore what is a context menu event and how we use it.

Objective: Learning how to disable right click on the browser.

<!DOCTYPE html>
<html>
    <head>
        <script src="mootools-core-1.4.5-full-compat.js"></script>
        <script>
                    window.addEvent('domready', function(){
                        $(document).addEvent('contextmenu',function(event){
                            if(event.rightClick===true){
                            alert('Right Click is disabled');
                            event.preventDefault();
                            }
                        });
                });
            </script>
    </head>
    <body>
        <div style="margin:0 auto;float:left">This document/page is protected, so right clicking the would not work, try it out and let me know.Please report if it does not work</div>
    </body>
</html>

Explanation: In line number 7 we attach the contextmenu event with the document, and further we check if the event is rightclick, once we are confirmed we show a message and then we call the preventDefault() function to make sure the right click context menu is not displayed. Do note that this is a browser based feature not all browser supports this.

Demo: Try Right click on this page and see what happens.