Disable right-click menu on WebView

Question

Well, this is exactly what I need to do :

When the user right-clicks on a WebView, the typical menu (without "reload",etc) should not show up.

How can this be done? Any ideas?

P.S. Also : is it possible that a custom menu is shown?

there are a couple of client-side JavaScript code to handle this situation and you just need to insert the relevant code into the `HTML` source. it does not depend on which engine you are using to view the `HTML` page. — holex, Aug 23 '13 at 08:40
@holex Hmm... Interesting idea. Any pointers to some example? — Dr.Kameleon, Aug 23 '13 at 08:42
like here is: http://stackoverflow.com/questions/381795/how-to-disable-right-click-context-menu-in-javascript, or here: http://www.javascripter.net/faq/rightbut.htm or here: http://javascript.about.com/library/blnoright.htm, I could say: Google is your friend. — holex, Aug 23 '13 at 12:23

chasew · Accepted Answer · 2013-12-07T19:38:01.013

It is simple to prevent the context menu with html:

<body oncontextmenu="return false;">

or with javascript (jquery):

$(document).bind(“contextmenu”, function (e) {
    e.preventDefault();
});

Or, if you want to show a custom html context menu using javascript...

HTML:

<div id="context-menu">                        
    <ul>                        
      <li>Item1</li>                      
      <li>Item2</li>
      <li>Item3</li>
    </ul>
</div>
<div id="op">Right click anywhere!</div>

CSS:

#context-menu {
    display: none;        
    position: fixed;       
    border: 1px solid #ddd;
    background: white;
    box-shadow: 2px 2px 1px grey;  
}
#context-menu ul {
    list-style: none;      
    padding: 0;
    margin: 0;
}
#context-menu li {
    width:150px;
    padding: 5px 8px;
}
#context-menu li:hover {
    background:#eaeaea;
    cursor:pointer;
}

JS:

function startFocusOut() {
    $(document).on("click", function () {   
        $("#context-menu").fadeOut(20);              // To hide the context menu
        $(document).off("click");           
    });
}
$(function(){
    $(document).bind("contextmenu", function (e) {
        e.preventDefault();            // To prevent the default context menu.
        $("#context-menu").css("left", e.pageX);   // position with cursor
        $("#context-menu").css("top", e.pageY);    
        $("#context-menu").fadeIn(20, startFocusOut()); // show the menu
    });    
    $("#context-menu li").click(function () {
        $("#op").text("You have selected " + $(this).text());  // Performing the selected function.
    });
});

Jsfiddle: http://jsfiddle.net/VRy93/

Took me some time to need that very same thing, and just discovered your late reply... to my own question. The thing is: it worked like a charm! Thanks! ;-) — Dr.Kameleon, Sep 06 '14 at 09:36

Disable right-click menu on WebView

1 Answers1