Invoke a right click mouse from the keyboard right arrow keydown

Question

$("#element").bind("keydown", function(e) {
    if (e.which === 39) { //if keyboard right arrow
        $("#element").trigger({
            type: 'mousedown',
            button: 2
        }).trigger({
            type: 'mouseup'
        });

        $("#element").bind('mousedown', function(ev) {
            if (ev.which === 2) {
                //call method - I need  pageX and pageY coordinates
                //methods.show.apply($this, [ev.pageX, ev.pageY, options.showAnimation]);
                alert("called");
            }
        });

    }
});

What I am trying to do is: Press the keyboard right arrow key, this then emulates the mouse right click trigger and now what I need is a handler so I can launch my context menu which needs X & Y coordinates.

VisioN VisioN · Accepted Answer · 2012-11-21T11:32:29

The following code will remember the mouse cursor position in the #element data. Then it will use the stored coordinates in keydown handler:

$(document).on({
    keydown: function(e) {
        if (e.which === 39) {
            var $el = $("#element"),
                pos = $el.data("pos");

            $el.trigger({
                type: 'mousedown',
                which: 3,
                pageX: pos[0] || 0,
                pageY: pos[1] || 0
            });
        }
    },
    mousemove: function(e) {
        $("#element").data("pos", [e.pageX, e.pageY]);
    }
});

$("#element").on({
    mousedown: function(e) {
        if (e.which === 3) {
            alert(e.pageX + " / " + e.pageY);
        }
    }
});

DEMO: http://jsfiddle.net/x4Bmw/2/

Invoke a right click mouse from the keyboard right arrow keydown

1 Answers