CODEWITHSUNDEEP
javascriptjqueryhtmlcssdrop-down-menu
Lars Holmqvist
Lars Holmqvist

Reputation: 81

Get sub menu to stay down we click inside subb menu

How can I do so that the menu does not ride up when I click inside subbmenyn? (Subbmenu will go up when you click on the main link or outside.) Can it be done without javascript? Then the menu goes over and works with muse over if you do not have javascript enabled.

FIDDLE

CODE:

$('.nav > ul').toggleClass('no-js js');
$('.nav .js ul').hide();

$(document).on("click", function(e) {
    var $elem = $(e.target);
    if ($elem.hasClass('clicker')) {
        $('.nav .js ul').not($elem.next('ul')).hide();
        $elem.next("ul").slideToggle();
    } else {
        $('.nav .js ul').hide();
    }
})

Upvotes: 1

Views: 130

Answers (1)

user1850421
user1850421

Reputation:

Simply change the else to check that the clicked element isn't in that container, and that it's not the container. Though you have several elements with the same Id, you should change them to a class

<div class="contentHolder">

so your jQuery would then be 

else if (!$($elem).parents('.contentHolder').length && !$elem.hasClass('contentHolder')) {

And you'll need to update the CSS #contentHolder to .contentHolder

http://jsfiddle.net/6ddvq/5/

Upvotes: 1

Related Questions