Drop Down Tab Menu

This is a lean CSS tab menu that supports a 2nd level drop down menu for any of its tabs. Both the tabs and the drop down menus are implemented as plain HTML for easy modification and search engine friendliness. A close relative of Chrome CSS menu, here are its features:

  • CSS and plain HTML based for effortless customization and search engine friendliness.
  • The main tabs support easy alignment- left, center, or right. Just modify the "text-align" property inside the CSS code.
  • Specify a tab that should be selected by default when the page loads (tab is assigned the "selected" CSS class). Optional.
  • Specify arbitrary HTML to automatically indicate a tab as having a drop down menu (ie: using a "down" arrow image as seen in the demo). Optional.
  • Drop down menu can be set hide any element on the page that it overlaps as it drops down. This is useful in hiding a form field, for example, if that field happens to show through the drop down menu as the two overlaps.
  • Drop down menu repositions itself if too close to the browser edges (so its always in view).
  • The delay before the menu is dismissed on mouse out can be customized.




Over 2000+ free Javascript
at JavaScriptBank.com Website
Sampled by JavaScriptBank.com
Test form field:

More information about Drop Down Tab Menu