Drop down menu without any module

Question

Hello is it possible to create drop down menu without using any plugins at all? In general the structure of menu is as follows for drop down.

<ul>
  <li><a href="#">Top1</a>
    <ul>
      <li><a href="#">drop1</a></li>
      <li><a href="#">drop2</a></li>
    </ul>
  </li>

I have create new menu and placed menu parents and children accordingly. Now I need to know if it is possible to show the menu in structure as above without using third-party modules.

Answer 1

You can do it with pure CSS, here is a tutorial: http://csswizardry.com/2011/02/creating-a-pure-css-dropdown-menu/ You can find several more if you google for CSS dropdown menu.

You will need to set up your menu, clicking on the "expanded" checkbox for any submenus you want to render.

Answer 2

You have two options:

1. As "Shoaib Nawaz" said in the comments, you can use Javascript (jQuery) to convert the list into a dropdown.

2. I don't know why you don't want to use any plugins (I suppose you mean "module")? But if it's fine for you to create your own module, there is another solution:

   • Create a module
   • Overwrite the function theme_menu_tree to convert the "ul" into "select"
   • Overwrite the function theme_menu_link to convert the "li" into "option"
   • Bonus: If you don't want to overwrite every menus, you can overwrite only a specific menu using [MODULE]_menu_link__[MENU NAME].