Disable horizontal scrolling by clicking the mouse wheel in the element with overflow-x:hidden

Question

How can I determine the possibility of horizontal scrolling by clicking the mouse wheel and disable it in the element with overflow-x:hidden (using JavaScript or jQuery)? Scrolling is impossible in Firefox but possible in IE, Chrome and Safari. Code example:

<div style="overflow-x:hidden; overflow-y:auto;">...</div>

Screenshots:

Answer 1

Perfectly possible, but not best practise (I presume you have a really good reason for wanting to do it, though):

$('#yourDivId').on('scroll', function(){
    $('#container').scrollLeft(0);
});​

See http://jsfiddle.net/q5CTS/3/ for a working snippet.