Prevent middle mouse click scrolling

Question

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.

Answer 1

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; }

Answer 2

Use:

$('body').mousedown(function(e){if(e.button==1)return false});

This works on Chrome: http://jsfiddle.net/PKpBN/3/

Answer 3

Try using return false; instead of e.preventScrolling();

Answer 4

document.body.style.overflow=allowScroll?"":"hidden";

Answer 5

If you want to stop scrolling completely, here is the required code:

window.onscroll = function() {
    document.body.scrollTop = 0;
}

This will effectively disable the middle button as well..