• PHP
  • Ruby on Rails
  • MySQL
  • Linux
    • SELINUX
    • Fedora
    • debian
  • Apache
  • nginx
  • AJAX
Albertech.net

Review: jQuery dropdown menu

February 8, 2009 8:00 pm / Albertech.net

Over the weekend, I ran across a dropdown script called jdMenu that runs off the jQuery library. It turned out to work great for me, as long as the level of menus is maxed at 2. I prefer using scripts that use the jQuery library in order to simplify the maintenance of scripts and to speed up development of Ajax scripts.

From my experience, modern dropdown menus should only use <ul><li> hierarchy tags to make it easy to maintain. As long as the coder knows HTML, they should be able to modify the dropdown menu. I’ve used dropdown menu scripts in the past that had javascript arrays, which are a huge hassle to maintain. Not to mention accessibility issues. jdMenu uses the list HTML structure, and does an efficient job at it. The script loads fast.

The only downside to the script is the development documentation and support, but I figured out how to modify the script to meet my needs.  For instance, I’ve converted the top level navigation links to images and used CSS to display the rollover of the images. If you want clickable top level links, make sure you DO NOT use the class=”accessibility” option.  The jdMenu script is definitely one to consider if you want to use dropdown scripts with CSS. Very fast and easy to rewrite to meet your specific needs.

Pros:

Very fast –actual script is only 3Kb
Works with search engines — plain unordered lists UL/LI HTML
Very easy to customize — jQuery code is easy to update
Works with IE6 and IE7 — There is a known issue where IE6/IE7 places select boxes on top of EVERY element in the page. This script takes care of that. I know many other scripts do not have this fix built-in.

Cons:

Limited documentation, but the code is easy to understand. Just need to have a handle of HTML and some JS in order to get started.
3rd level+ menu order isn’t fully supported. I suggest not having menus written with that many levels anyway, too confusing for the user.

Share this:

  • Facebook
  • Google
  • Twitter
  • Print
  • Email
Posted in: AJAX / Tagged: dropdown menu, jdmenu, jquery

One Thought on “Review: jQuery dropdown menu”

  1. gyrolistic on February 10, 2009 at 12:59 pm said:

    Nice tip regarding jdMenu. For many years now I’ve been using HVmenu from dynamic drive here: http://www.dynamicdrive.com/dynamicindex1/hvmenu/ – you can go infinite levels down, though I usually only max out at 3. Great comparison with the pros vs. cons. What are you thoughts about the prototype + scriptaculous (http://www.prototypejs.org/); how about dojo? What books on jQuery do you recommend?

Post Navigation

← Previous Post
Next Post →

Categories

  • AJAX
  • Android
  • Apache
  • Canon Cameras
  • Cloud
  • CMS
  • Computer Mods
  • Conferences
  • Deals
  • debian
  • Fedora
  • Flash
  • Frameworks
  • git
  • Hardware
  • HTML
  • IDE
  • iPhone
  • iPhone App Review
  • jQuery
  • Linux
  • Mac OS X
  • MySQL
  • nginx
  • PHP
  • portfolio
  • Puppet
  • Ruby on Rails
  • Script Reviews
  • SELINUX
  • Software
  • Software Review
  • SQL Server
  • statistics
  • Tech
  • Tomcat
  • Uncategorized
  • VMWARE
  • VPS
  • Windows
  • wordpress
  • Zend Framework

Blogroll

  • DragonAl Flickr
  • Dropbox – Free 2GB Account
  • James' Blog
  • Javascript Compressor
  • PHP Builder Community
  • PHP-Princess.net
  • Rubular – Regular Expression Validator
  • The Scale-Out Blog
  • Tiny MCE

Tags

activation AJAX android antec Apache AWS awstats canon coda codeigniter debian enclosure external free G1 install vmware tools Internet Explorer iphone 5 jquery Linux mx-1 MySQL office 2007 OSX photoshop PHP plugin plugins portfolio redesigned website review rewrite script security SELinux ssh tinymce tutorial upgrade VMWARE vmware server wordpress wordpress mu XSS zend framework
© Copyright 2013 Albertech.net
Infinity Theme by DesignCoral / WordPress
loading Cancel
Post was not sent - check your email addresses!
Email check failed, please try again
Sorry, your blog cannot share posts by email.