Disable Right Click Using MooTools 1.2
We all know that it's bad practice to disable the right click context menu, so I'll skip the explanation of why that is. Unfortunatley, however, customer request comes before anything else when you're doing their website. If your project is using MooTools 1.2, you can achieve this goal.
The MooTools 1.2
window.addEvent('domready', function() {
document.body.addEvent('contextmenu',function(e) {
e.stop();
});
});
Again, the only time I would do this is if the customer asked for it. It's good to know that it's so easy to implement, right?
![Create Namespaced Classes with MooTools]()
MooTools has always gotten a bit of grief for not inherently using and standardizing namespaced-based JavaScript classes like the Dojo Toolkit does. Many developers create their classes as globals which is generally frowned up. I mostly disagree with that stance, but each to their own. In any event...
![5 HTML5 APIs You Didn’t Know Existed]()
When you say or read "HTML5", you half expect exotic dancers and unicorns to walk into the room to the tune of "I'm Sexy and I Know It." Can you blame us though? We watched the fundamental APIs stagnate for so long that a basic feature...
![Create a Simple Slideshow Using MooTools]()
One excellent way to add dynamism to any website is to implement a slideshow featuring images or sliding content. Of course there are numerous slideshow plugins available but many of them can be overkill if you want to do simple slideshow without controls or events.
![MooTools, mediaboxAdvanced, and Mexico]()
The lightbox is probably one of my favorite parts of the Web 2.0 revolution. No more having to open new windows (which can bog down your computer quite a bit) to see a larger image, video, etc. Instead, the item loads right into the...
contextmenu eh?? hmmm, news to me.
ZOMG Bad practice alert!!!
Kidding, you can only argue that so far. Also, this is quite useful should you want to implement your own context menu…
dave…
whad do yo use to format source code on your blog post? (the code that puts the line #’s, copy to clipboard, e.t.c.)
thanks…
I think e.stop() is enough, because it already do preventDefault in the Mootools Core source.
@Lim Chee Aun: Good call! I’ve adjusted the code. Thank you for mentioning that.
This is also so useful when planning to add a custom context menu to your page, or a custom menu appears when you right click a certain element (a hyperlink, a button, or an image).
Thanks for sharing, David.
@Ahmed: Thanks — I have been working on a custom context menu…
@David: You’re welcome! Will you populate the custom context menu?
PS: Is it possible to work a clipboard manager (copy selection to clipboard) using MooTools?
uhg. I do not like this. Disabling my browsers features is not cool, I would be upset at any site or service that pulled this.
@Ahmed,
javascript cannot access the clipboard(which is a good thing) unless the browser has some feature that allows this(like older builds of IE). However, with the help of flash, you can do it, which is what syntaxhighlighter(in use here) does.
Quit good for prevent picture steeling ;) ….
great stuff, it’s new to me to heard about contextmenu, but anyway good job…. hope you will work more about mootools….
@weblizzer: To put it simple, a context menu is the menu that appear when you rightclick somewhere, like on Windows desktop for example, the “Refresh New-> etc..” is a contextmenu.
Why document.body and not document.documentElement (i.e. html tag)? What id body has a margin, or html has a padding set?
I don’t this will prevent displying context menu from opera…as far as I know you can’t disable context menu in opera….
@Roshan: That’s correct.
hi,
its all fine, but do you have any solution to show Custom Context Menu on right click in Opera???
if you find any solution please reply to my email , immidiately, you help will be highly appriciated, thanks
imran
This article could also assist: http://laymensterm.blogspot.com/2008/12/disable-copy-command-and-right-click.html
David,
For compatibility with IE7, shouldn’t that be $(document.body) rather than just document.body?
Rob
For reference, you should be able to disable this by overriding the
oncontextmenuevent in the javascript console. It looks like this is being added todocument.body, soThanks. This post is very helpful to me. I have a question. I want to display a classic “lightbox” popup when the user do a click over an “” element and I want to disable the context menu in the “” elements to prevent the posibility of open a new window or new tab . But in Firefox and Opera I still can open a new tab with a click of the scroll button in the mouse. You do know some way to disable the default associated to a click with the scroll button?
Thanks, and sorry for my poor english.
sorry, I refer to the “a” elements, but in the comments was taken like code.