PDA

View Full Version : disabling middle mouse botton for combobox



hgoli
02-05-2007, 03:23 PM
Hi.
How can I disable middle mouse button for scrolling on a combobox?

jscheuer1
02-05-2007, 05:22 PM
In IE and Opera:


<select id="bob" size="6" onmousewheel="return false;">

Capturing the middle mouse button for the purpose of disabling it can be done, somewhat. But, I haven't seen any reliable cross browser method. It also may depend (in this case) upon the layout, other scripts (if any) and exactly why you need this. Any javascript solution will not work if javascript is disabled. Also, it might be better to capture and use the middle mouse button rather than disabling it.

In short, if you can find a way to not need to disable it, even to not need to capture it, that would be best as, the cross browser support on this one is thin.

jscheuer1
02-05-2007, 06:25 PM
I looked into this a bit more, and this seems pretty reliable:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Kill Wheel on Selects - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function ffkillwheel(el){
if(el.addEventListener&&!el.onmousewheel)
el.addEventListener('DOMMouseScroll', killwheel, false);
}
function killwheel(e){
var e=e? e : window.event;
if (e.preventDefault)
e.preventDefault();
e.returnValue = false;
return false;
}
</script>
</head>
<body>
<select size="6" onmouseover="ffkillwheel(this);" onmousewheel="killwheel()">
<option value="">ffffffffffff</option>
<option value="">ggggggggfffffff</option>
<option value="">ddddddddddfffffff</option>
<option value="">rrrrrrrrrrrr</option>
<option value="">xxxxxxxxffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
<option value="">ffffffffffff</option>
</select>
</body>
</html>

blm126
02-05-2007, 08:38 PM
Why do you want to disable the middle mouse button? I think you would be much farther ahead to avoid a situation where that is necessary.

jscheuer1
02-05-2007, 10:07 PM
Why do you want to disable the middle mouse button? I think you would be much farther ahead to avoid a situation where that is necessary.

That was my initial reaction as well. However, since someone asked me a little while back to make up simultaneous scrolling divisions I noticed there are times that one doesn't want the mouse wheel involved.

The real problem is that the mousewheel's brand of scrolling often, if not always, doesn't change the scrollTop position of the element being scrolled. If your script works off of that value, it will break when the user scrolls your element with the mousewheel.

Interestingly, while researching the code I posted for this solution I discovered a routine that will capture the event for use by other code. Ultimately this might be the way to go with scripting the mousewheel. Since its direction and possibly travel can be captured, the wheel event could be made to power a scroll event, thus making the wheel compatible with the scrollTop value once again. I'm not certain that the travel can be captured but, a reasonable value probably could be assigned and used.

For more on how this might be done, see:

http://adomas.org/javascript-mouse-wheel/