CODEWITHSUNDEEP
javascriptjquerycsstwitter-bootstrap
Guifan Li
Guifan Li

Reputation: 157

hide dropdown menu on click the item in the menu

I have five buttons, for each button, if you mouseover it, it will popup the dropdown menu (The default setting in bootstrap for dropdown is to click, but I need the button to achieve some other purposes when click the button, so I use a e.stopPropagation() to prevent the click popup action). In the css file, I set 

.dropup:hover .dropdown-menu {
    display: block;
}

My question is that, when I click the item in the dropdown menu, it will not hide anymore. Is there anyway to solve this issue?

Upvotes: 0

Views: 754

Answers (1)

Jack
Jack

Reputation: 2771

Could you do something like this in place of your css so you don't have to rewrite functionality?

$(function() {
    $(".dropdown").hover(
        function(){ $(this).addClass('open') },
        function(){ $(this).removeClass('open') }
    );
});

Reference: https://stackoverflow.com/a/21486327/1585362

Upvotes: 1

Related Questions