Start a new discussion

To start a new discussion please visit the discussions section of the GitHub home page of the project.

Discussions on GitHub

You can also search our old self-hosted forums for any useful information below but please note that posting new content here is not possible any more.

katieTBA

Forum Replies Created

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • in reply to: Custom mega menu with ul columns gets stuck open #3811
    katieTBA
    Participant

    EDIT: I reviewed the nav again and actually I think the issue is this: when I move my mouse from a second level li (or its children) to the children of a sibling li and then out of the drop down altogether, the display:block that is being applied by SmartMenus JS to the ul that is the immediate child of the top level li doesn’t get removed and the drop down stays open. If anyone has any thoughts on how to change this, I would appreciate your thoughts.

    katieTBA
    Participant

    For anyone with a similar question, I used the keyboard addon available on the Smart Menus GitHub: https://github.com/vadikom/smartmenus/tree/master/src/addons/keyboard.

    katieTBA
    Participant

    Edit to correct item 1. above:
    I would like to open submenus when their sibling link item has focus.

    in reply to: Top Level Menu Item Shows/Hides Sub Menu on Click #2892
    katieTBA
    Participant

    Hello, thanks for your quick response!

    Changing hideOnClick to false makes it work the way I want it to when the menu is not in its mobile version. However, it breaks it in mobile: I can open but not close submenus by clicking on the first-level nav item in the mobile version. Is there a way to say hideOnClick: false only at min-width:970px? 970px is my breakpoint for switching between the mobile/non-mobile versions of the menu.

    Thanks again!

    in reply to: Automatically close sub menus when opening other sub menus #2782
    katieTBA
    Participant

    I haven’t tested it yet in all mobile devices, but so far this works beautifully! Thank you so much for your help – you’ve been invaluable! đŸ™‚

    in reply to: Automatically close sub menus when opening other sub menus #2778
    katieTBA
    Participant

    Yes, the behavior of the menu on the site you linked to is exactly what I’m looking for! It would be great if you could create a demo; thank you again for all your help!

    katieTBA
    Participant

    Thanks for your response! I’m not quite sure I understand…let me see if I can put my question another way. It seems like the problem that you identified in your earlier version of the script (the version that allowed for accordion functionality) is that part of an expanded sub menu might be scrolled out of view when a menu above it is auto collapsed. Would it be possible to not only auto collapse a sub menu when another main menu item is clicked on, but also at the same time scroll the clicked on main menu item to the top of the screen, so that its expanded sub menu will show in full?

    Thanks again, you have been so helpful!

    in reply to: Automatically close sub menus when opening other sub menus #2770
    katieTBA
    Participant

    Also, I’m seeing the issue that you mentioned (“it is sometimes not appropriate to auto collapse other branches since the active item might be scrolled out of view”). Is there a way to keep the accordion functionality, but also auto scroll to the main menu item that was clicked so that no part of the expanded sub menu section gets pushed off screen?

    in reply to: Automatically close sub menus when opening other sub menus #2769
    katieTBA
    Participant

    Great, thanks! Here is the script as I now have it in the <head>:

    <script type="text/javascript">
    	$(function() {
    			   
    			   $('#main-menu').bind('click.smapi', function(e, item) {
    		var obj = $(this).data('smartmenus');
    		if (obj.isCollapsible()) {
    			var $item = $(item),
    				$sub = $item.dataSM('sub');
    			if ($sub && !$sub.is(':visible')) {
    				obj.itemActivate($item, true);
    				return false;
    			}
    		}
    	});
    		$('#main-menu').smartmenus({
    		});
    		$('#menu-button').click(function() {
        var $this = $(this),
            $menu = $('#main-menu');
        if ($menu.is(':animated')) {
          return false;
        }
        if (!$this.hasClass('collapsed')) {
          $menu.slideUp(250, function() { $(this).addClass('collapsed').css('display', ''); });
          $this.addClass('collapsed');
        } else {
          $menu.slideDown(250, function() { $(this).removeClass('collapsed'); });
          $this.removeClass('collapsed');
        }
        return false;
      });
    	});
    </script>

    That works! Just wanted to double-check: I’m not unnecessarily duplicating anything, am I?

    Thanks again!

Viewing 9 posts - 1 through 9 (of 9 total)