Friday, July 16th, 2010

Create Simple Dropdown Menu Using jQuery

In this post, we are going to create a simple dropdown menu  with the help of jQuery, take a look at the demo of it first. I assume you know at least the basics of jQuery and CSS. The key to creating the dropdown menu is to use the CSS’s properties: position, top, left, z-index.

With these properties, we make sure that dropdown menu appears exactly below the hovered link and over any other element. We then make sure that when mouse is over a link, we show the corresponding dropdown menu and when mouse is away, we hide it back. For these events, we use the jQuery’s mouseenter and mouseleave methods. So that’s all we need to know to create the dropdown menu, pretty simple stuff !

View Post …



Related Posts


Category: jQuery
You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.
  • Sum of 1 + 7 ?