Today I had to make a simple script that changed the class of an element when you “right clicked” on it but I struggled for hours trying to disable the right click contect menu from showing.

Finally I found a simple solution so I decided to share :)

I tested it on FF 3.6 & IE7

the magical line is 

$(el)[0].oncontextmenu = function() {
			return false;
		}

For a concrete example here is my code

$(".besoin").bind('mousedown',function(event){
		switch (event.which) {
	        case 3:
			        if($(this).hasClass("mild")){
						$(this).removeClass("mild");
						$(this).addClass("hot");
					} else if($(this).hasClass("hot")){
						$(this).removeClass("hot");
						$(this).addClass("superhot");
					} else if($(this).hasClass("superhot")){
						$(this).removeClass("superhot");
					} else {
						$(this).addClass("mild");
					}
	        break;
		}
		$(this)[0].oncontextmenu = function() {
			return false;
		}
	});

Have fun !

Share

Related Posts: