CODEWITHSUNDEEP
javascriptjqueryhtml5-canvascontextmenu
Ajaii
Ajaii

Reputation: 41

Create Context Menu on single click

I am trying to create a context menu. When the user clicks inside canvas(HTML5), a context menu should appear and When an item in the menu is clicked, some functions should be called.

Can someone help me?

Upvotes: 0

Views: 405

Answers (1)

Devendra Soni
Devendra Soni

Reputation: 1934

please go through this jsfiddle link this might help you to achieve this. In this example the orange area is canvas and if you will right click on it, it will show the context menu.

function createCustomMenu()
{
     $(".box").unbind("click").bind("click", function (event) {
        // Avoid the real one
      event.preventDefault();

        $("#custom-menu").hide(100);
        // Show contextmenu
        if ($("#custom-menu").show() === true) {
            $("#custom-menu").hide(100)
            // In the right position (the mouse)
            css({
                top: event.pageY + "px",
                left: event.pageX + "px"
            });
        } else {
            $("#custom-menu").show(100).
            // In the right position (the mouse)
            css({
                top: event.pageY + "px",
                left: event.pageX + "px"
            });
        }            
    }); 
}

now if user will uncheck the checkbox then it context menu will be disable.if user will check then only it will show he context menu.so i have updated this link also please see the working example..

click on this link to see the jsfiddle example:-http://jsfiddle.net/TnbYm/22/

use this

Upvotes: 4

Related Questions