I'm looking for a way to stop the middle mouse click from causing the browser to start scrolling, and showing the little scroll 'compass'.
I have seen Disabling middle click scrolling with javascript however the solution is a bit more hackey than I would like, and doesn't seem like something I could actually use.
I'm looking for a more definitive "This is how you do it" or "You cannot do that, son".
I am of course open to hacks and workarounds.
Just because S.O. questions look nicer with code, here is what I am using to close tooltips when right or middle clicking.
msg.mousedown(function(e) {
if (e.which == 2) { //middle mouse click
msg.hide();
e.preventScrolling(); //if only this worked...
}
else if (e.which == 3) { //right mouse click
msg.hide();
}
}).bind('contextmenu', function(e) {
e.preventDefault();
}).click(function(e) {
e.stopPropagation();
});
edit: jQuery, JavaScript, whatever, let's just all play nicely now :)
Edit 2:
I'm more interested in preventing the little scroll 'compass' than stopping the page from scrolling. I guess that wasn't very clear from my initial description.
Use:
$('body').mousedown(function(e){if(e.button==1)return false});
This works on Chrome: http://jsfiddle.net/PKpBN/3/
There's no need to include jQuery just for this.
If you are using jQuery, there are already some great answers here. If not, you can use vanilla JS:
document.body.onmousedown = function(e) { if (e.button === 1) return false; }
tested with the current version of firefox and chrome
document.body.onmousedown = function(e) {
if(e.button == 1) {
e.preventDefault();
return false;
}
}