Drop down menu

HTML & CSS
1

How do I make a drop down menu that appears with a click rather than a hover?

2

The easiest way is to use the superclick plugin as you get some accessibility built into the menu. If js is disabled you get the basic hover menu.

Here’s a basic example I made in garish colours using that plugin.

There are css ways to get click actions using the ‘checkbox hack’ but they fail on older webkit and are not as accessible.

3

Thanks PaulOB; I’ll have a careful look at your code.

4

This may be a little more information than you’re looking for, but have you checked out some of the popular Responsive Frameworks out there? They come with menus like you’re looking to build “out of the box” along with a TON of other convenient modules and styles.

Two that come to mind would be:

Bootstrap (currently version 3)
Foundation (currently version 6)

These frameworks have saved me countless hours and are mobile-first layouts, so your site or app will look good on loads of devices.

5

Thanks mainstwebguy1; I look forward to more research!

Best wishes

Tony Holland

6

can you show us the source code for any drop down menu

7

You can follow the example link and view the source in your browser.

1 Like
8

There are different way of making drop down menu. If you look over youtube you can see so many ways of making drop down menu processes .

9

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.