What is the best way to make jump menu (HTML select dropdown)?
css, jquery, xhtml
Solution
The “jump menu” is a discredited navigational device from many years ago that should not be brought back.
Auto-navigate-on-change `<select>` menus are unsuitable for navigation because:
keyboard users will be firing a change event every time they move the selection, making it impossible for them to use the control;
non-JavaScript agents (including search engines) won't be able to see or follow the links;
form values are retained over page back/forward navigations, making the select show the wrong value after a navigation, making it impossible to select the same option again;
users can't use their browser's normal navigational tools like middle-click, ‘open in new tab’ or ‘bookmark link’.
Therefore the ‘best’ way to make a jump menu is not to. If you want something that behaves similarly but doesn't have these disadvantages, go for a `<div>` that's hidden and re-popped-up by JavaScript, containing plain `<a>` links pointed at the pages they go to. You can style it to look like a dropdown if you really want, and you can make them open new windows when left-clicked if you must (I wish you wouldn't, though).
Problem
Every `<option>` in an HTML `<select>` will have external URL and should open in new a window. If it's possible to make in CSS and HTML only then good, if not possible without JavaScript then it should be unobtrusive.