Hi, I'm having a problem with my menu, and I'm hoping with many eyes and ideas I can get a fix for this. Attached is a copy of my menu with some quick pages to help identify the problem. The menu works great until I drop down to the mobil menu, then only the menu links that do not have submenus on them work, the others only toggle to the submenu, but do not activate the page.

This is probably an easy one, but I have exhausted many days trying to get this menu just right. I've seen some ideas from other menu's like using the drilldown, and adding the same name to a link in the submenu, and that would work I think, but when you get out of the mobil menu, you end up with two home buttons.

Thanks to all for the posts, I find so much great info here, so now hope I can get some ideas.

You only have 9 pages but have 20 links.

Nice menu by the way.....

If you are asking about a advanced control feature I may have missed your question's meaning.

Take for example Coffeecups own menu. You can click a dropdown link to see the available links but also if you click the dropdown a second time it will take you to a page rather than closing the dropdown. It would take some jquery to make your menu do that....and a little time.

Thanks Twinstream, I took a look at Coffeecups menu, and yes that is what I need my mobil menu to do, but it does not. I looked at their code for the menu, and they are using a flyout class which I don't see a part of Foundation, and I'm not familiar with the bootstraps. So I don't see help in there.

Clicking on my home link in mobil only opens and closes the submenu, it does not take you to the home page. When you do click Home in mobil it brings up the submenu, and clicking on Chips Meow will take you to that page, but clicking In-Memory only opens and closes that submenu, it never takes you to the In memory page.

Maybe I need to get out of foundation and move on to bootstrap, meaning more time taken learning something new.

If you want to have a Home button to return to the main page, you will need to remove the dropdown on that button.

You typically only can have one action on a menu button - go to a link - or do a dropdown.

I beleive Coffeecup is using the Menu Builder to make the navigation. You will see the flyout class used for the submenus in the Menu Builder code. You will also see how they enable the dropdown button to activate it if you click again to take you to a link.

They may be using something like:



and then removing the prevent-default class ?

The Coffeecup site doesn't look like having been made with Bootstrap. And your problem has nothing to do with which framework you are using. There MIGHT be a problem with those buttons having submenus, that the actual main buttons also have links.
Edit:
Twinstream has come to the same conclusion about the main buttons with dropdowns, I see. But there might be a way to solve it. I have never used that bit of js.

I came across an interesting website tonight that had a nice spin on your menu request. Instead of using the home button for the dropdown, keep it a standard button with a link. Then beside the home button create a "+" button and that button next to home will open a dropdown. Worked pretty slick.

Twinstream wrote:

I keep having a problem with that though, if it works when your not in mobil mode, over the first break point, there should be a way of getting something close in mobil mode.

I can see how adding another menu link to my dropdown for mobil will work, but then when you get out of mobil you have two of the same links. Example when you hover over home your dropdown will have home as the first link also, and both links will work, unless I disable the main one. Just doesn't look good to me.

I will keep trying, been working with menus now for over 2 weeks straight, and so I will continure.
Thanks for your inputs.

Hi Stephen, sorry I was late to the party. I did a foundation menu on my site that literally took me ages to get the way I wanted with lots of trial and error so have a bit of experience with the foundation menu. Can you tell me what is wrong with it currently and what needs to be done. maybe a quick drawing so I can visualise what needs to be corrected?
Regards

I can see what is wrong now. I not sure it would make a good user experience if the dropdown is also a link especially on a mobile device. I would not expect the home button to also be a dropdown with other links. Can it be redesigned to give better usability?

My menu can be found on https://phildias.com/

I am not sure it is possible as just tested the drowdown with my menu adding a link and it does not work in mobile but works on larger screens.
Regards