Make submenu slide open/close

Home Forums Older releases 1.0.x + Bootstrap addon Make submenu slide open/close

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #3439
    Pretzels
    Participant

    I absolutely love this script! Exactly how I think a mobile menu should work. Thank you.

    When I open my main menu, it slides open. However, when I open my submenu, it just immediately appears.

    Is there a way to make the submenu slide open as well?

    #3440
    Pretzels
    Participant

    So I figured out the opening part. In jquery.smartmenus.bootstrap.js, change collapsibleShowFunction: null on line 41 to:

    collapsibleShowFunction: function($ul, complete) {
    	$ul.slideDown(200, function() {
    		complete();
    	});
    },

    However, I haven’t quite figured out the closing. I tried doing the same thing with collapsibleHideFunction, but it still seems to jump closed.

    #3443
    admin
    Keymaster

    Yep, as you’ve noticed, by default the addon mimics Bootstrap’s default behavior so the sub menus are not animated in collapsible mode. So, you would need the following options:

    collapsibleShowFunction: function($ul, complete) {
    	$ul.slideDown(200, complete);
    },
    collapsibleHideFunction: function($ul, complete) {
    	$ul.slideUp(200, function() {
    		$ul.parent().removeClass('open');
    		complete();
    	});
    }

    And also another small change in “jquery.smartmenus.bootstrap.js” – comment out/remove the following code:

    ,
    'hide.smapi': function(e, menu) {
    	$(menu).parent().removeClass('open');
    }

    Alternatively, if you would like to avoid editing “jquery.smartmenus.bootstrap.js”, you could add the options directly in the HTML source in a data-sm-options attribute:

    https://www.smartmenus.org/docs/#data-sm-options

    and add the following JS code on your page after the link to “jquery.smartmenus.bootstrap.js”:

    $(function() {
    	$('ul.navbar-nav:not([data-sm-skip])').unbind('hide.smapi');
    });

    Cheers!

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.

Register

You will be emailed a link to set your password.

Login

Lost password?