How to stop scroll wheel from selecting different menu options

[amirkarger]

I have a simple "quickbrowse" menu that does this:

<form>
<select name="quickbrowse" onchange="go(this)">
<option selected value="">go to a tool...</option>
<option value="#tool1">Great tool #1</option>
<option value="#tool2">Great tool #2</option>
<option value="#tool3">Great tool #3</option>
</select>
</form>

It calls this function:

function go(selection) {
var place = selection.value
// Ignore empty selection (default "pick a tool" choice)
if (place) {
location=place;
}
}

It works beautifully. However, in IE, after it goes to the new
location, if I turn the scroll wheel before clicking on anything, the
scroll wheel selects different options from the <select>, which makes
the browser jump to a totally different tool (section of the page). In
Firefox, it (correctly) scrolls up and down the text at the tool I had
originally selected.

I tried putting a document.focus() or a selection.blur() into the go
function, but they didn't seem to help.

Any thoughts?

Thanks,
-Amir Karger

 

[ASM]

I have a simple "quickbrowse" menu that does this:

<form>
<select name="quickbrowse" onchange="go(this)">
<option selected value="">go to a tool...</option>
<option value="#tool1">Great tool #1</option>
<option value="#tool2">Great tool #2</option>
<option value="#tool3">Great tool #3</option>
</select>
</form>

It calls this function:

function go(selection) {
var place = selection.value

var place = selection.selectedIndex.value
// would fix all your pbs

// Ignore empty selection (default "pick a tool" choice)
if (place) {
location=place;
}

if(place) location.href = place;
else alert('make an other choice');

 

[Other]

However, in IE, after it goes to the new
location, if I turn the scroll wheel before clicking on anything, the
scroll wheel selects different options from the <select>, which makes
the browser jump to a totally different tool (section of the page). In
Firefox, it (correctly) scrolls up and down the text at the tool I had
originally selected.

I tried putting a document.focus() or a selection.blur() into the go
function, but they didn't seem to help.

document.focus() is bogus. Try window.focus() instead. Or indeed
selection.blur(), if "selection" is a variable referencing the <select>
element. If it is, I 'd give it a less confusing name, as the term selection
has meaning already in some browsers.

hth
ivo
http://4umi.com/

 

[amirkarger]

document.focus() is bogus. Try window.focus() instead. Or indeed
selection.blur(), if "selection" is a variable referencing the <select>
element. If it is, I 'd give it a less confusing name, as the term selection
has meaning already in some browsers.

hth

It h'ed. Btw, onmousewheel="returnfalse" was a neat solution, but then
the mousewheel wouldn't move up & down in the text of the window after
jumping. window.focus nicely puts the focus back in the window so the
scroll wheel works as expected.

Thanks for the quick response.

-Amir

 

[RobG]

It h'ed. Btw, onmousewheel="returnfalse" was a neat solution, but then
the mousewheel wouldn't move up & down in the text of the window after
jumping. window.focus nicely puts the focus back in the window so the
scroll wheel works as expected.

What happens if you use arrow keys to go up or down the menu?

 

[amirkarger]

Arrow keys & return seem to work. Not that very many people will use
that, I expect.

-Amir