Responsive Menu on all or specific site widths
-
-
- voltayr
- Newbie
- Posts: 10
- Thanks: 0
-
Hi we have a mega menu installed in the Vermilion template and its working great! there a four sizes of the site in width, i dont know the dimensions exactly but there is mobile, "big", bigger(960 it think) and biggest (1200 i think). the Mega menu works fine on the 1200 and 960, but is not doing well on the "big" size.
I want to make the mobile size menu SHOW on the "big" size. apparently tablet users are getting the "big" size. I want them to instead the get Mobile menu to show up on their tablets.
Where do i adjust this? what controls how the mobile menus triggers per site width dimensions, is it a file i edit and if so what name and location... is it a setting in a module?
The site is www.edgewaterfl.gov thx again!
if you change the width of the browser youll see that on the "big" size if you mouse over Departments, the police and fire department drop way down into the bottom left area.
so to avoid this i want this size screen to get the SAME menu that a mobile phone would if you were to scale the browser width down one more size.
Voltaire - Last Edit: 9 years 10 months ago by voltayr. Reason: added info
-
-
-
- DanG
- Preeminent Rocketeer
- Posts: 36750
- Thanks: 3229
- Custom work done
-
voltayr wrote:
I want to make the mobile size menu SHOW on the "big" size. apparently tablet users are getting the "big" size. I want them to instead the get Mobile menu to show up on their tablets.
Where do i adjust this? what controls how the mobile menus triggers per site width dimensions, is it a file i edit and if so what name and location... is it a setting in a module?
The site is www.edgewaterfl.gov thx again!
With Gantry 4 the framework decides when to activate the mobile dropdown menu. This cannot be controlled by the user. It's different in Gantry 5 where the user can define breakpoints so as to cause the mobile dropdown menu to appear.
voltayr wrote:if you change the width of the browser youll see that on the "big" size if you mouse over Departments, the police and fire department drop way down into the bottom left area.
so to avoid this i want this size screen to get the SAME menu that a mobile phone would if you were to scale the browser width down one more size.
Voltaire
To be fair to the menu, you've placed the main menu very far down on your page so it's not surprising it runs off at the bottom.
I think you might be able to better utilize the space on your menu item Departments. The Economic Development child items you have drop straight down and the user has to scroll to see all the items. Why not use a flyout for Economic Development so that the child itmes open to the right.
-
-
-
- voltayr
- Newbie
- Posts: 10
- Thanks: 0
- Ok great... what if i turn off responsiveness all together. i did attempt this and when i attempted to shrink the browser window, still certain elements were collapsing and moving. i had set it to fixed 1200 thinking it would just fit itself fully into a mobile browser.
-
-
-
- DanG
- Preeminent Rocketeer
- Posts: 36750
- Thanks: 3229
- Custom work done
-
voltayr wrote:
Ok great... what if i turn off responsiveness all together. i did attempt this and when i attempted to shrink the browser window, still certain elements were collapsing and moving. i had set it to fixed 1200 thinking it would just fit itself fully into a mobile browser.
Okay...in Gantry 4 NOTHING will trigger the Gantry Mobile menu to appear other than when it sees the template is being viewed on an ACTUAL (320px to 480px) mobile device screen.
Again your issue is simply one of styling. The dropdowns will never be seen properly because you've placed the menu so far down the page.
-
Time to create page: 0.157 seconds