Last updated December 31, 2015. Created on November 2, 2013.
Edited by Christopher James Francis Rodgers. Log in to edit this page.

DHTML Menu uses Javascript to reduce the number of page loads
when you are using nested menus (sub-menus).

This is particularly useful when you want to immediately see which pages are in a sub-menu (and the sub-menus of that sub-menu), because you will not have to open additional pages just to find out which pages are contained in a sub-menu.

DHTML Menu project page (including Download links)

Drupal 7 DHTML-Menu live site example

At bottom of the following page
you will see the D7 DHTML-Menu in action.
It is the Drupal 'Book Navigation' menu 'block'
which I renamed as my "Site menu".

The DHTML-Menu on that page is setup
according to the following instructions

Drupal 7 (D7)

Do Not use the Beta version. Use the Dev version.

Do NOT use the "Beta" version
(7.x-1.0-beta1 2010-Nov-09 )

[From the year 2010].

Use only the "Dev" version
(7.x-1.x-dev 2013-Sep-30)

[Actually From the year 2011].

The dev version is actually from 2011-Nov-10.
When was upgraded from Drupal 6
to Drupal 7 on 2013-Sep-30,
all dev versions of modules and themes
which came out prior to that day,
and which have not had subsequent releases
now all carry a dev release date of 2013-Sep-30.

If you had installed the dev version 2011-Nov-10
prior to 2013-Sep-30, the update manager will indicate
that a newer dev release is available,
but in fact the two releases are the same.

You do Not need to update dev version 2011-Nov-10
to dev version 2013-Sep-30
unless you simply want to eliminate the update notice.

You must "Clear all caches" after running the update script.

You need to run the Update script
after updating to a newer version of Drupal 7,
and after updating some modules.

I have found that any-time, and every-time,
that I run the updates script
as for example,
after updating Drupal to a newer version,
as for example,
from D7.21 to D7.22,
the DHTML menus will not expand
unless I clear the caches on page
"Configuration" > "Development: Performance"
at [d7-root]/admin/config/development/performance.
Click the button "Clear all caches".

DHTML Menu option settings location.

Administration > Configuration > User interface > DHTML Menu

Option changes I use on every site.

Other effects
- 'When a menu opens': "Keep other menus open"
- 'When a menu closes': "Close all its sub-items, too"

Default option settings.

This list is intended to let you know
what the original option settings are,
so that you will feel free to experiment
by changing any option you want to try,
and yet allowing you to know
what the original default options were.

  • Static navigation
    • No Collapsing
  • Animation
    • Effects
      • Slide in vertically
      • Fade in
    • Speed
      • Fast (0.5 s)
  • Other effects
    • When a menu opens
      • Close other open menus in the same tree.
    • When a menu closes
      • Remember which sub-items were expanded
        when it next opens.
    • When a new page is loaded
      • Expand only the currently active path.
  • Disabling DHTML
    • Filter type
      • Disable DHTML on the menus checked below.
    • List
      • [NONE]


Drupal 6 (D6)

[Insert - Please help by adding your knowledge here.]

I do not use D6, so I can only guess
that you might be better served
by using 6.x-3.x-dev (2013-Sep-30) (*2)
instead of 6.x-3.5 (2009-Jun-05),
since in the case of Drupal 7
the dev version functions far better
than the recommended release (beta version).

(*2) - Note: The dev version is actually Not from 2013-Sep-30,
but after was upgraded to Drupal 7
the dev versions without subsequent releases
now all carry a release date of 2013-Sep-30.

So, additionally, if you had installed the dev version
prior to 2013-Sep-30, the update manager will indicate
that a newer dev release is available,
but in fact the two releases are the same,
and so you do Not need to update to version 2013-Sep-30.


Looking for support? Visit the forums, or join #drupal-support in IRC.