0

I have a menu where I display my dropdown on hover. All the elements in this menu are clickable, but also the parent's menu item. I'd like to hide the dropdown-menu when I click on one of the menu items, including the main one (the parent).

At moment, when I click on the parent, it triggers the "open" class, but I don't know what should I do to override that.

<div class="collapse navbar-collapse" id="navbar" ng-controller="HeaderCtrl">
  <ul class="nav navbar-nav navbar-right" style="font-weight:bold;">
    <li id="parent" class="dropdown desktop">
      <a href="#" ng-click="$event.preventDefault();gotoElement('services')" data-toggle="dropdown" class="dropdown-toggle">{{'MENU_SERVICES' | translate}}<b class="caret"></b></a>
      <ul class="dropdown-menu" style="background-color:black;">
        <li><a href="/services/weddings">{{'CATEGORY_WEDDINGS' | translate}}</a></li>
        <li><a href="/services/session">{{'CATEGORY_SHOOTING' | translate}}</a></li>
        <li><a href="/services/course">{{'CATEGORY_INTERNSHIPS' | translate}}</a></li>
        <li><a href="/services/prints">{{'CATEGORY_PRINTS' | translate}}</a></li>
      </ul>
    </li>     
  </ul>
</div>

That's the css part to display my dropdown on hover :

@media screen and (min-width: 768px) {
    .dropdown:hover>.dropdown-menu {
      display: block;
    }
  }

I was thinking of doing something like that on the parent click (of course, it's not the solution) : $('#parent').removeClass('open');

krakig
  • 1,515
  • 1
  • 19
  • 33
  • Can you post your code.. – Aneesh Sivaraman Aug 26 '16 at 10:30
  • Just FYI, hover dropdown menus are not good for UX – Lee Aug 26 '16 at 10:34
  • the code of the click event, please – Sergio Tx Aug 26 '16 at 10:35
  • 1
    possible duplicate http://stackoverflow.com/questions/23764863/how-to-close-an-open-collapsed-navbar-when-clicking-outside-of-the-navbar-elemen or http://stackoverflow.com/questions/33824255/bootstrap-how-to-close-an-open-collapsed-navbar-when-clicking-outside-of-the-me – Ismail Farooq Aug 26 '16 at 10:56
  • Oh yes, exactly, that's what I was looking for, I'll adjust my code, thanks! @Lee Does that mean that I should put my parent menu item in the dropdown and handle it like the others? – krakig Aug 26 '16 at 11:04

0 Answers0