pentester pentester - 1 year ago 83
CSS Question

How can I make my toggle menu close when I click away?

I'm am struggling to get the drop down to close when I click away.

It only closes when I click the the parent.

$("#nav > ul > li").on('click', function(){

What's the best solution in this case?

Answer Source

Here's how you'd do that

$('#nav > ul > li').on({
    mouseenter: function() {
        $('a', this).addClass('hover');
    mouseleave: function() {
        if (! $(this).hasClass('active') )
            $('a', this).removeClass('hover');
    click: function(){
        $('.hover').not( $(this).find('a') ).removeClass('hover');

$(document).on('click', function(e) {
    if ( $('#nav .active').length === 0 )


Fixed a few other issues as well

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download