Free CSS Drop-Down Menu Framework

Features

• Modular, with themes. Not only HTML is separated from CSS, but even CSS definitions are categorized into structural and thematic types. Thus creating a new css drop-down menu means creating only a new theme since structure is permanent. What is more, creating a new theme is easy with available templates and takes 10-15 mins.
• Easily deployable. The code and files are well organized. Available channels to hook up to your CMS or other tools as well as existing websites in XHTML format.
• Easily transformable. Can be transformed by changing class name only. Available transformations: horizontal, vertical left-to-right, vertical right-to-left, horizontal linear, horizontal upwards.

• Cross browser. Configurations available for Windows Internet Explorer 5 or later, Mozilla Firefox 1.5 or later, Opera 7 or later, Apple Safari 2 or later, Google Chrome 1, etc.
• JavaScript only for IE. Minimal JavaScript code only for IE 6 or earlier. Can be used with popular JavaScript libraries Jquery or Scriptaculous. Everything else is pure CSS.
• Super Fast. Having the above mentioned features it is not affected by any disturbances whatsoever.
• Continuous development. The project is constantly revised and improved.

Showcase

Download & Support

This CSS Drop-Down Menu is free and licensed under the GNU General Public License.

Download now! v1.0.2

Please consider donating to support further development:

Amount in USD:

Thanks a lot!

Leave your comments, questions, feature requests, etc.

Please participate actively to recieve extras an bonuses. Send in your themes or leave links where you're using this framework to be published and improved here. Also you can provide links of desired drop down menus out there that you would like to be implemented with this framework. Additional mimic themes will be here for download afterwards. If you have any comments, questions, feature requests or anything else please use the form below.

You are allowed to use the following tags: <a>, <strong>, <em>, <u>, <code>, <blockquote>

* Indicates required fields

• * Name:
• * E-mail: (will not be published!)
• Website:
• Your favourite drop-down menu online:
  
• * Comment:
• * Code:

Latest Comments

• July 2nd, 2009 at 7:20PM (+2 GMT)dean wrote:

  check compatibility mode for IE8

• July 1st, 2009 at 4:30AM (+2 GMT)Benito Estrada wrote:

  Superb work! Congrats!!

  The only complaint I have is the IE8 problems.

  Like others, I do not like IE at all. But there is a lot of people using this.

  Bad luck this has not been fixed.

  Anyway, your work is elegant.

• June 30th, 2009 at 9:39PM (+2 GMT)Michael wrote:

  I am teaching myself CSS while making a pro-bono site for a local organization. I found your drop down menus, and love the result, but I am having a problem. I found a sample somebody here posted on how to center my nav bar in a container, but when I do it cause the horizontal scroll bar to expand, what in the world am I doing wrong? also some of the css is for a customized scrollable text area, although the problem with the navigation was occurring before I added this code, is it part of my problem? Any help would be awesome! you can view the site here: http://www.thinkrainmaker.com/clients/wvhealthright/

  Thanks Again! and great script!

• June 30th, 2009 at 3:59PM (+2 GMT)Werner Hartnagel wrote:

  Thank you! Well done, it's easy to customize and building own themes.

• June 29th, 2009 at 9:55AM (+2 GMT)Tom Nobles wrote:

  I would like to donate. However, I do not have Pay Pal, it seems they do not like my credit card?

  Borders, Amazon and Tiger direct don't have a problem with it.

  If you have any way I could make a donation please let me know.

• June 29th, 2009 at 4:12AM (+2 GMT)rob t wrote:

  When I use safari to view the samples (horizontal simple) there is about 20px margin on the left. But in firefox the menu is up against the right edge of the browser window. Not sure why that is.

• June 28th, 2009 at 11:38AM (+2 GMT)hadi wrote:

  dropdown.flickr.com.horizontal.html looks profissionla .. but there is no Right to left vesion

  are you going to do it soon

• June 25th, 2009 at 5:47PM (+2 GMT)internet wizard wrote:

  Your framework saved so much time! Thanks a lot for sharing this piece of code. I'll show some of my work when I'm done. Peace!

• June 24th, 2009 at 8:31PM (+2 GMT)Clark wrote:

  Great tutorial, Thanks!

• June 24th, 2009 at 12:28PM (+2 GMT)Dragan wrote:

  EXCELLENT job, but i also have a question. I have made a qutie long menu - and one of the submenus is also quite long - so when mouseover happens - submenu becomes visible and extends downward (as expected) but IT DOES NOT STAY IN THE VIEWPORT.
  Does someone have a ready to go solution for that problem? A script (part of code) that makes the menu STAY WITHIN THE VIEWPORT?

• June 23rd, 2009 at 7:53PM (+2 GMT)Gulet Cruise wrote:

  Good work, well done on the awards too. I think one of our sites could do with a better looking drop-down menu.

• June 23rd, 2009 at 7:51PM (+2 GMT)Roxbourne Web Design SEO wrote:

  Thanks for providing that, we ended up using the MTV style menu on our own website design. Your version is much better than the actual MTV one - they cant even vertically align their menu text properly!

• June 23rd, 2009 at 3:07PM (+2 GMT)mobzam wrote:

  Hello,
  I can I adjust the horizontal menu for example if I want menu to be appearing on the top of the page. I want the top margin to be zero(0) which file(s) should I adjust.

• June 22nd, 2009 at 12:40PM (+2 GMT)fahad wrote:

  i like flicker dropdpwn menu

• June 21st, 2009 at 1:38AM (+2 GMT)Martin wrote:

  I saw that the comment does not escape the html code, so here it is:

  <ul id="nav" class="dropdown dropdown-horizontal">
  <li><a href="2.0.html">Home</a></li>
  </ul>

• June 21st, 2009 at 1:36AM (+2 GMT)Martin wrote:

  I got a centered menu (the "Adobe" one) to work.

  Menu code (Html):

  Home

  Additional css code:
  #nav {
  list-style-type:none;
  padding:0;
  margin:0 auto;
  float:left;
  position:relative;
  left:50%;
  }
  #nav li {
  float:left; position:relative; right:50%;
  }
  #nav li li{
  position: relative; left: 0;
  width: 100%;
  }
  #nav a {
  width:auto;
  display:block;
  text-decoration:none;
  }

• June 19th, 2009 at 5:51PM (+2 GMT)jank wrote:

  Hello,
  I have some problems in ie6. i use this framework for my menu in typo3 4.2.6. the problem is that i get an js error in ie6 in combination with the extension rgsmoothgallery and the menu doesn't drop down.
  is there any workaround?

• June 19th, 2009 at 12:08AM (+2 GMT)Alex wrote:

  Nice Work .........:)

• June 18th, 2009 at 8:35PM (+2 GMT)Parthiban.T wrote:

  Free CSS Drop-Down Menu Framework is very nice and it is extremly useful in making my new website. Really it rocks,,, Look great keep up guy...

• June 18th, 2009 at 7:36PM (+2 GMT)Ronald Able wrote:

  I cannot get the Nvidia drop down to work in ie8,,,, anyone have a clue how to fix it?

  It doesn't even work on this site for me. After one item of the submenu is highlighted, it will not flip to the rest of them

View all comments