Patch for D6 - Use menu item bullets to expand menus
| Project: | DHTML Menu |
| Version: | 6.x-3.5 |
| Component: | Javascript code |
| Category: | feature request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | needs review |
Hi,
I've attached a patch for the 6.x-3.5 version of the module which adds the option to use the menu item bullets to expand/close the submenus. This isn't a direct backport from the 7.x version and, although this is similar to the issue #117370: Remove DHTML Menu code from Actual Links and Make Bullets The Clickable Element I thought this was worth posting because I've taken a slightly different approach.
Rather than using a nested link which can cause hassles with 'event bubbling', I've used the Jquery 'before' function to add a link for the bullet action before the normal menu item. Since it's a separate tag, it can be moved and themed easily (I haven't tried an RTL theme yet though). The scripting isn't as clever as the dynamic positioning in the 7.x version, but I wanted something simple that themers could use.
Most of the patch is to the JS file, but it also adds a configuration option for the bullets to the admin menu (which, when selected will ignore the options for a 'cloned' link and double-click action since they're no longer needed) and adds a CSS class to the menu 'branches' to make life a bit easier for themers.
There are also some basic styles added to the CSS file to get bullets working, but I've left this pretty minimal, as I assume most people will change this in their theme (especially as IE needs some hand-holding to get things in the right place). In an attempt to keep things a bit accessible, the bullet link has some descriptive link text, which is then hidden using the top-padding/overflow-hidden technique.
Anyway, hope that's useful - it's going to be a while before I get my sites moved to D7!
| Attachment | Size |
|---|---|
| dhtml_menu_3-5_bullets.patch | 5 KB |
#1
+1000
#2
Hi,
Glad it's helpful. It needs some work though, as I've noticed some weirdness when the 'Keep only one menu open at a time' option is selected - menus open OK, but then slam shut again! - so I need to look into that.
#3
I notice that it's still a pain to apply a patch on windows... It is possible to have the modified .module file ?
#4
Hi,
It's actually some of the supporting files that are modified, so I've attached a zipped version of the whole module folder with the patched files.
#5
Thank you very much, with little CSS, it works like a charm.
Just a few things, I noticed that in the javascript file, the label "Toogle" menu is hardcoded. I think it would be great to be able to choose what you cant to display. In my case I display nothing to make a background image, so I had to tweak a little the JS file to remove that label.
Thank you very much.
#6
Hi,
Glad it's working for you. Yeah, the link text is currently hardcoded in the JS file, but it does go through the Drupal t() function so you can replace the string using the locale module, if you have that enabled. I guess I could add an admin option for that, but I wasn't sure how useful that would be - the text is really only there to try and make the menu a little more accessible. Like you, I hide the text and only show a background image using the top-padding trick (taken from the tweaked dhtml_menu.css):
li.dhtml-menu a.dhtmlMenuControl{
position: absolute;
left: -0.5em;
width: 1em;
height: 0; /* hide link text */
padding: 1em 3px 1px 3px; /* add top-padding so that bullet image shows */
overflow: hidden; /* hide the overflowing text */
background: none;
text-decoration: none;
}