Home/ Questions/Q 6224477
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-24T08:40:48+00:00

We’ve all seen numerous CSS 2 dropdown menus, and those used to be the

  • 0

We’ve all seen numerous CSS 2 dropdown menus, and those used to be the best way to make a drop down menu for a website. However, I am wondering:

With all these new technologies out there, is there a better way to make a dropdown menu than CSS 2 :hover based hidden div menus?

The reason I still use the old CSS 2 hover menu is because I haven’t found something else that is as cross-browser compatible, simple, standards compliant, and viewed properly by as many end users.

The bottom line is, I want to move forward as much as possible in every aspect of website development, but this is one area I am not sure it is safe to move forward in yet.

Is it time to drop the “sites shouldn’t depend at all on javascript” standard and start using jQuery dropdown menus?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The current thinking in the world of web development is that you should take a progressive enhancement approach to building your websites. This is a layered approach working from the bottom up: basic content (semantic HTML) forms the foundation, with look and feel (CSS) placed on top, and finally functionality sits atop of them all (provided by JavaScript).

    The approach you’re talking about would be the first two layers described above (HTML & CSS). You could always use jQuery in addition to this to provide functionality or extra fancy touches to the menu, provided you do this unobtrusively (that is, hook up events programmatically using jquery selectors). For example you could use jQuery to make the menus fade in and out on hover.

    Now the important point to realise it that you don’t have to ditch CSS to do this kind of thing – it’s not an either/or type of question. By layering like this, and unobtrusively using JavaScript, you get a website that will work perfectly for all visitors! Those without JavaScript and without CSS will get the basic content, and they can navigate through your site (although it won’t look pretty!). Those without javascript but with CSS will still a basic menu with drop downs on hover, styled using just CSS. And those with JavaScript and with CSS will get the best representation of the site, with CSS providing look and feel and JavaScript providing added functionality/effect.

    What you should take from this is that websites do not need to look the same in every browser. For incapable browsers, ensure that the content can be presented unhindered in it’s basic form. For more capable browsers add extra layers of styling and functionality to take advantage of their more advanced features. Basically, everyone has access to your content as intended and you still get to push your web development further 🙂

    This article articulates the concept better than I ever could: http://www.alistapart.com/articles/understandingprogressiveenhancement

    • 0