3

Possible Duplicate:
How to distinguish between left and right mouse click with jQuery

How to open context meniu when I click with right mouse click inside the div. Because when I click with right mouse button inside div its fadeouts?

Javascript

$("#link").click(function(e){
   e.stopPropagation();
   div = $("#mydiv").fadeToggle(300);
});

$("#mydiv").click(function(e){
   e.stopPropagation();
});

$(document).click(function(e){
   $('#mydiv').fadeOut(200);
});

HTML

<a id="link">Click</a>
<div id="mydiv" style="width: 200px; height: 200px;">Hello</div>

UPDATE:

Javascript

$("#link").click(function(e){
   e.stopPropagation();
   div = $("#mydiv").fadeToggle(300);
});

$("#good_buttom").click(function(e){
   e.stopPropagation();
   div = $("#hide").fadeToggle(300);
});

$("#mydiv").mousedown(function(e) {
switch (e.which) {
    case 1:
         e.stopPropagation();
         $('#mydiv').fadeOut(200);
        break;
    case 2:
        alert('2');
        break;
    case 3:
        alert('3');
        break;
    default:
        alert('You have a strange mouse');
}
});

HTML

<a id="link">Click</a>
<div id="mydiv" style="width: 200px; height: 200px;">
    <button id="good_button">Click IT</button>
    <div id="hide" style="display:none;">Show up.</div>
</div>
Community
  • 1
  • 1
andys
  • 708
  • 3
  • 11
  • 29
  • hi i was looking in this article but didnt understand... I am new in jquery... any help ? – andys Jan 03 '13 at 08:55

1 Answers1

3

click is only triggered by left mouse click, while mousedown can be triggered by left/middle/right mouse click. So just replace click with mousedown in your code, and distinguish left/middel/right click by checking event.which. Please check How to distinguish between left and right mouse click with jQuery for an example.

BTW: Checking this link may help you understand the relationship between click, mousedown and mouseup events. And this article: Javascript Madness: Mouse Events maybe also helps. As a rule of thumb, it's preferable to handle low-level events like mousedown or mouseup instead of high-level events like click or dblclick when you need more control on mouse events.

One more problem is that you put a superfluous "#" before mydiv in HTML.

Update: As per your new requirement, you may add the following code to avoid event propagation.

$("#good_button").mousedown(function(e) {
    e.stopPropagation(); // avoid triggering its parent
    div = $("#hide").fadeToggle(300);
});
Community
  • 1
  • 1
Hui Zheng
  • 10,084
  • 2
  • 35
  • 40