URL: https://www.peterbe.com/plog/better-select-boxes/demo.html
If you look at the Add Issue form on the Demo issue tracker you should see the three select boxes (aka. drop downs) and if these become too long they tend to be difficult to use. Here's a potential solution that; I just need to know what you people thing about it's usability.
I use onfocus() and onblur() to change the size attribute of the select input element thus temporarily giving the user a bigger workspace. Please have a play on this demo page and return here after for feedback.
The disadvantage with this, in terms of usability, is that it's unexpected and might not work exactly the same in all browsers. When the drop down expands it also shifts all surrounding content downwards which might make the user feel dizzy when the page "flickers".
Personally I think it's a great feature because drop downs are often difficult to work with if there are many options and the size is small. Another advantage which this "hack" is that it degrades perfectly in browsers that don't support javascript and it works independently of the mouse.
Comments
Update. Just checked. It works in IE6.
Incremental search (with a text box above the select) is another way to handle the same basic issue, I think.
And what is incremental search?
When you start typing, it starts filtering the choices. So in Javascript you'd look for onkeypress or something, and then do a substring search of the contents of the select, and hide any options that didn't match what was in the box.
OK, it's unexpected, but one gets the hang of it real fast. It's very logical to see what happens. Nice, I would say.