Turning off sub menus at a breakpoint...

User 2839984 Photo


Registered User
43 posts

I have long submenus in my design, so when viewed on a mobile they just fill the screen. Is there a way to turn off a submenu at a specific break point? This way visitors can just touch the main button and go to an interstitial page that has links to the pages in the sub menu.

You can view it here: http://www.longmancomputers.com/global/ if you reduce the browser size you can see where the breakpoint kicks in.

My second question is why does the menu disappear behind the first couple elements as you scroll (fixed menu) but remains on top of the rest of the page - although this might be a RSD issue.

I have attached the file.

Thanks!

Bruce
Attachments:
Just another day designing websites for money... it's all good!
User 2699991 Photo


Registered User
1,734 posts

Bruce Longman wrote:
I have long submenus in my design, so when viewed on a mobile they just fill the screen. Is there a way to turn off a submenu at a specific break point? This way visitors can just touch the main button and go to an interstitial page that has links to the pages in the sub menu.

You can view it here: http://www.longmancomputers.com/global/ if you reduce the browser size you can see where the breakpoint kicks in.

My second question is why does the menu disappear behind the first couple elements as you scroll (fixed menu) but remains on top of the rest of the page - although this might be a RSD issue.

I have attached the file.

Thanks!

Bruce


Hi Bruce from Sunny Bali

Not Really sure you can turn off submenu buttons like that unless mess about with the css once its exported (as in set display to none and not even sure about that unless one is a real Guru at CSS.)

I am not exactly sure why you have put the smaller view port menu onto a second row/column at smaller screen sizes, the breakpoint comes in at around 1030 px by altering margins and menu button widths you can achieve a topline menu down to around 800px, at which time all you need do is change the menu to the small screen menu that is built in on the layout pane. then you can mess about with margins and positions again and keep the menu on the same line as the logo., even right down to almost the smallest viewport.

there is a definate problem with the submenus dropping behind the other rows/columns, I once had that happen to me and for the life of me cannot remember how it was fixed.

I have taken the liberty to alter the project file to keep the menu just on one line even at smaller viewports, but without the RSD design to reference I have guessed some of the positioning.

Take a look at it and if it's the sort of thing you are thinking about (bearing in mind the submenus are still fairly long even at smaller viewports) you can adjust and mess about with positions and margins etc.

Good luck and a great looking web-site.

Wayan

The Sky Is A big Empty Space : But There Is No Room For Error
website https://rsdtutorials.com
User 2699991 Photo


Registered User
1,734 posts

Hello again
Having thought further there is another solution

have 2 menu's (menu1 & menu 2 just example manes)
Menu 1 is placed in container on the top row (right of the logo) for large viewport sizes, with the sub menus etc
Menu 2 (set for smaller viewports) is placed in a second row/column underneath the top row with just menu buttons and NO sub menus
IN RSD
you set the menu 1 position display to block as normal etc etc at the higher viewport size, and you set the row/column for menu2 to position display : none.

Then at the breakpoint where you want to make it you set the container for menu 1 to position display : none,
and the row/column position display to Block etc etc

theoretically that should give you a lower viewport menu without the submenu's which is what you are sort of after (I Think)
The Sky Is A big Empty Space : But There Is No Room For Error
website https://rsdtutorials.com
User 2839984 Photo


Registered User
43 posts

These are both great ideas!! Where do I download your revised project version? Love to see how you altered it.

Thanks!!!

B
Just another day designing websites for money... it's all good!
User 379556 Photo


Registered User
692 posts

Please forgive my adding an extra possibility.

I haven't looked at the example in question, but within Menu Builder I have made submenu buttons disappear at a breakpoint as follows. This certainly works with Menu Builder's default buttons even if a background has been set, and might work with other situations as well. It could be worth a try.

(a) I go to Design > Menu down arrow > Submenus Buttons > All Buttons.
(b) I move the slider to the left of the breakpoint.
(c) For both the Regular tab and the Hover tab I tick the Font box and set the em figure to zero.

Frank
User 2699991 Photo


Registered User
1,734 posts

Bruce Longman wrote:
These are both great ideas!! Where do I download your revised project version? Love to see how you altered it.

Thanks!!!

B


OOOOOPS sorry old age and dementure are setting in I forgot to attach the revised project so sorry

Haven't made example of my second suggestion been a little bit busy today

will attach file shortly as I just got a problem with my computer
Attachments:
The Sky Is A big Empty Space : But There Is No Room For Error
website https://rsdtutorials.com
User 2699991 Photo


Registered User
1,734 posts

Ignore attachement on previous post, it's the wrong project file, somethings gone awry with my computer, am on it now will send proper project file shortly
The Sky Is A big Empty Space : But There Is No Room For Error
website https://rsdtutorials.com
User 2699991 Photo


Registered User
1,734 posts

I haven't used menu builder for ages, now I remember why IT KEEPS CRASHING
The Sky Is A big Empty Space : But There Is No Room For Error
website https://rsdtutorials.com
User 2839984 Photo


Registered User
43 posts

Yeah, I had it crash on me too this week and had to redo the menu from scratch. NO problem, whenever you are ready.
Just another day designing websites for money... it's all good!
User 2699991 Photo


Registered User
1,734 posts

Not only crashing but you also lose the styling whenever you try to remove a sub-menu.

I eventually developed my own dropdown menu using html & css exactly because of this problem (I reported it years ago nothings happened)
The Sky Is A big Empty Space : But There Is No Room For Error
website https://rsdtutorials.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.