Question

This is the problem I am having. I need to attach some kind of handle to a draggable div.

What I need to do is capture the right mouse button every time that I right click on div within the parent.

This is my child creation code. This code works fine and I can create multiple div without a problem.

var smallBlock = $('<div class="SmallBlock"></div>').appendTo("#canvas");
smallBlock..draggable({containment: "#canvas", scroll: false, grid: [10, 10]}, {cursor: "move", cursorAt: {top: 125, left: 150}})
smallBlock.append('<div class="article_title fontCenter fontBold font32">Article Title</div>')
smallBlock.append('<div class="article_Image"><img style="width: 250px;" src="<? echo $image1 ?>"></div>')
smallBlock.append('<div class="font14"><? echo substr($article_text, 0, 200) ?></div>') 

And this is the mouse click code.

<script type="text/javascript">

function getRightClick()
{
    // check for right mouse pressed

$('#canvas').mousedown(function(event) {
    switch (event.which) {
        case 1:
            alert('Left mouse button pressed');
            break;
        case 2:
            alert('Middle mouse button pressed');
            break;
        case 3:
            alert('Right mouse button pressed');
           break;
        default:
            alert('You have a strange mouse');
    }
});
}

</script>

I have no idea how to make the get the div to recognize that a right mouse was clicked over it.

BTW, there are other classes of divs within the parent which I need to detect; so a more general solution might be better.

Answer 1

you could add this to the context id element:

oncontextmenu="alert('right click on element');return false;

or perhaps this:

jQuery('#yourDIVId').mousedown(function(event) {
   var rightclk = false;
   if (event.which) rightclick = (event.which == 3);
     if(rightclk == true){
        alert('yes')
    }
});