Start a new discussion
To start a new discussion please visit the discussions section of the GitHub home page of the project.
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
-
AuthorPosts
-
katieTBAParticipant
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.
June 9, 2017 at 06:25 in reply to: Accessible Drop Downs - Using Keyboard to Navigate Menu Items #3551katieTBAParticipantFor 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.
May 31, 2017 at 05:16 in reply to: Accessible Drop Downs - Using Keyboard to Navigate Menu Items #3545katieTBAParticipantEdit to correct item 1. above:
I would like to open submenus when their sibling link item has focus.katieTBAParticipantHello, 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!
October 21, 2015 at 08:43 in reply to: Automatically close sub menus when opening other sub menus #2782katieTBAParticipantI 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! đŸ™‚
October 11, 2015 at 05:22 in reply to: Automatically close sub menus when opening other sub menus #2778katieTBAParticipantYes, 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!
October 2, 2015 at 06:14 in reply to: Automatically close sub menus when opening other sub menus #2773katieTBAParticipantThanks 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!
September 28, 2015 at 05:40 in reply to: Automatically close sub menus when opening other sub menus #2770katieTBAParticipantAlso, 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?
September 28, 2015 at 04:17 in reply to: Automatically close sub menus when opening other sub menus #2769katieTBAParticipantGreat, 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!
-
AuthorPosts