Dropdown Menu Weirdness - Onclick NOT Onhover and Only When Parent

Yeah. Bootstrap by default is click to show dropdown. For Radix 2.x, we had some custom js to add the hovers.

See http://drupalcode.org/project/radix.git/blob/refs/heads/7.x-2.x:/assets/...

@niccolo try https://github.com/CWSpear/bootstrap-hover-dropdown

@arshadcn After thinking about this - is it a good idea to add the hovers - or is it better just sticking with the default bootstrap behavior and leave it up to the developer to add the hover, if they want that?

@lsolesen, I've been thinking about this too and I think this is the best approach. Let's see what others think.

I think we should follow Bootstrap's defaults, but adding a setting to activate onhover is welcome :)

Arghh... The hover is really not working with my current project. I'm using YAMM style mega menus and the hover doesn't work well for them. Click is better for large menus.

Commenting out the dropdown on hover fixes my problem, but . . . I don't want to alter the base theme.

I know this is more of a general theming question, but what is the best way to remove this JS in the sub theme? I've found several examples of js_alter, but none seem to really do what I want to do (remove or nullify those lines of code.)

Hooks are a little advanced for me. But I'm learning. Thank you.

We're going to have dropdown shown by default. I'm linking the other issue here: #2459429: Show drop downs on main menu at all times.

@astringer, take a look at an implementation of hook_js_alter in Radix. https://github.com/radixtheme/radix/blob/7.x-3.x/template.php#L89

This might help.

Thanks arshadcn. I appreciate the help. That gets me closer to where I need to be, I think I can figure out the rest.

For what it's worth I agree with barraponto -- I think it's best to stick with Bootstrap default behaviors and allow the option of turning on the hover or adding it. Or better yet turning it on for certain screen sizes.

Additionally at less than md screen sizes the behavior was wonky. This was because the top menu link was turned on -- so when I clicked to open the submenu, I was taken to the top link.

Once again thanks for the help. I really appreciate it.

Hi, I'm back here dealing with this again on another project. Stopped by to see if there was an update.

I think the OP's reporting the original Bootstrap behavior as a bug is not well thought out. Bootstrap is mobile-first, there is no hover state on mobile devices.

It makes no sense to have desktop-only navigation in a responsive framework.

Should I make a separate issue for this?

So, how to activate the dropdown on hover for the main menu?!

Also, I notice that if I copy-paste the dropdown example from getbootstrap.com, that will work on HOVER, why that isn't the case for the generated main menu?

This menu is a huge WTF at the moment.

Currently my top level items with drop downs are completely broken.
It looks like the href has been replaced with "" but I get hover behaviour, so when I click the item it just refreshes the page (because of no href).

My quick work around for my issues is overriding the radix_dropdown behaviour in my theme's JS, like this:

/**
  * Override the radix_dropdown behaviour, which is provided by the Radix theme.
  */
Drupal.behaviors.radix_dropdown = {
  attach: function(context, setting) {
    // Make dropdown link work.
    $('div.oa-navigation a.dropdown-toggle').once('dropdown-fix').click(function(e) {
      window.location = $(this).attr('href');
    });
  }
};

We have found the same issue with the mega menu and quick work around.
Attaching a patch for the same.