/    Sign up×
Community /Pin to ProfileBookmark

Mouse Wheel and Drop Downs

Copy linkTweet thisAlerts:
May 06.2004

This is a problem that plauges alot of sites, and I have yet to see logical solution. When a user comes to our site and selects a size for lets say a ring. Then they proceed to try to scroll their window up and down without leaving the drop down menu they ultimately screw up their choice.

Some users are not savy enough to notice that since they were still in the drop down that the size has changed, and never notice untill they get the final invoice after purchase. So my question is: Is there a way to lock drop down menus from being controlled by mouse wheels?

to post a comment
JavaScript

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@theBody44May 06.2004 — The problem arises because the combo box still has focus on the form. The only way I know to avoid it is to set the focus on another form element. It sounds like you're talking about using this on a form so do something like this...

<form name="myForm">

<select size="1" onChange="document.myForm.text.focus()">

<option selected>One</option>

<option >two</option>

</select>

<input id="text" type="text">

</form>

The key is the "document.myForm.text.focus()". You are setting the focus on the text box, or the next element on the form (by tab index) which takes the focus off the combo box. Therefore, if you scroll, you no longer scroll through the list. Hope this helps, this is the most logical solution I could come up with.
Copy linkTweet thisAlerts:
@David_HarrisonMay 06.2004 — You could just use onchange="this.blur();" No need to specify any other form element.

The only problem is, if the user clicks on the select box to change their option but then decides against it. Then the select box is still selected and the mouse wheel is all set up to screw up user's choices, I can't think of a cure for this, but it is unlikely to happen.

When they submit the form you could ask them if the information that they provided is correct on another page, if they spot something incorrect on that page it would give them another chance to change it.
×

Success!

Help @Jazlewood spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...