Mobile Menu: Top Level Menu Items as links
Home › Forums › Older releases › 1.0.x › Mobile Menu: Top Level Menu Items as links
- This topic has 4 replies, 2 voices, and was last updated 4 years, 7 months ago by
admin.
-
AuthorPosts
-
July 10, 2016 at 19:59 #3218
sascha
ParticipantHi there,
I just used the plugin for the first time and it works quite well. Thank you for sharing this!There are 2 things though I find confusing (on mobile view!), but maybe they work like that for a reason.
1. Top level links
When you tap the top level link the menu opens. When you tap it again the link is being followed. Is there a reason for this behaviour?
I expected either of those:
a) tap the top level -> link is followed straight away (only the plus/minus sign is used for opening and closing the menu)
b) When I saw the menu open on tapping the top level link, I assumed tapping it again would close it. It was confusing that it suddenly followed the link.
Would it be wise to create an option in the plugin to allow following the top level link straight away (or is there an easy way to accomplish this)? Basically option a) above…
2. Sub-Menu Links
Those are followed straight away, but you still see the menu closing. I find this unnecessary and a bit annoying as I always think there is something happening still on the site. Is there a possibility to switch that behaviour off? Basically stopping any animation when a link is being followed…
July 13, 2016 at 16:22 #3233admin
KeymasterHi,
1) There are a number of different ways it could work and it’s really a matter of personal preference. The main reason to have it expand the sub menu on first tap by default is that otherwise most mobile end users would not ever expand the sub menus and see the sub pages options – they would just keep tapping and loading the main links. And not using the whole menu item just as sub menu toggle allows setting actual links that could be followed by the users on second tap – even if they expect the sub menu to get hidden on second tap instead of the parent link loaded, they would learn what to expect on the next page (hopefully :)). So, yeah, I mean all diifferent behaviors have their pros and cons.
But anyway, this could be tweaked via the API.
For a), use this additional code:
http://www.smartmenus.org/forums/topic/href-not-working-on-parent-as-expected/#post-3025
If you would like b), you could use this:
http://www.smartmenus.org/forums/topic/hide-submenu-of-clicked-menu-item-only/#post-2714
For 2) you could try using the
hideOnClick: false
option.July 13, 2016 at 17:54 #3234sascha
ParticipantMany thanks for the reply. That really helps!
While I was thinking about this and using a tablet (do not often do this), I had another tought. Would it be possible to totally disable the top menu links and just have them open and close the sub-menus? Then I would copy the top level link with jQuery to the top position into the sub-menu and call it “Overview” and maybe even highlight it a bit with CSS.
I felt this the least confusing option for users on touch devices. The top-level items always just toggle. Not sure how to differentiate it towards desktop usage of the menu though…
July 14, 2016 at 14:47 #3238sascha
ParticipantJuly 21, 2016 at 12:47 #3248admin
KeymasterTo make the parent items just a toggle for the sub menus onclick (in collapsible and in desktop mode) just use the code from 1 b) above and disable the collapsible check – i.e.:
$(function() { // use the whole parent item as sub menu toggle button $('#main-menu').bind('click.smapi', function(e, item) { var obj = $(this).data('smartmenus'); // if (obj.isCollapsible()) { var $sub = $(item).dataSM('sub'); if ($sub && $sub.is(':visible')) { obj.menuHide($sub); return false; } // } }); });;
-
AuthorPosts
- You must be logged in to reply to this topic.