Tagged: full-width submenu, mobile menu
-
AuthorPosts
-
May 27, 2016 at 1:53 am #639035
Hi Guys!
I’m using a full width submenu as my primary menu, which is fine for the most part. However due to the number of items on the menu, I’d like to force it to go mobile at screen widths at or below 830px. I now this is before it normally would for smart phones, but I don’t want it to go mobile for anything under 990px. Is there a way to do this just with CSS, or would I need to adjust Enfold’s javascript as well?
Scott
- This topic was modified 8 years, 7 months ago by scotthco.
May 27, 2016 at 8:29 am #639157Hi Scott,
Could you provide us with a link to the site in question so that we can take a closer look please?
Regards,
RikardJune 20, 2016 at 12:01 am #650533Sorry it took so long for me to respond. Actually I need the full width submenu to go mobile at anything less than 980px screen width. Anything over that, and it should be the normal menu. Just so you know, in Theme Options, Header, Mobile Menu tab, I do have it set to go mobile for both tablets and smartphones, but that obviously applies only to the main header menu, not to full width submenus (but it probably should).
The URL is on my development box, so I’ll post it in the private content area below.
June 21, 2016 at 3:52 am #651203Hi,
Thank you for the info. Please add this in the Quick CSS field:
@media only screen and (max-width: 989px) { .responsive #top .av-menu-mobile-active .mobile_menu_toggle { display: inline-block; } .responsive #top .av-menu-mobile-active .av-subnav-menu { display: none; } .responsive #top .av-menu-mobile-active .av-open-submenu.av-subnav-menu { display: block; } .responsive #top .av-menu-mobile-active .av-subnav-menu li { display: block; border-top-style: solid; border-top-width: 1px; padding: 0; } .responsive #top .av-subnav-menu > li:first-child { margin-top: -1px; } }
Best regards,
IsmaelAugust 19, 2018 at 9:03 pm #999084This reply has been marked as private.August 20, 2018 at 9:12 am #999232Hi, ProTravelGolf
Could you please attach a mockup of what you’re trying to achieve?
The password to the area does not work, the page just reloads.
Best regards,
VictoriaAugust 20, 2018 at 11:41 am #999308This reply has been marked as private.August 20, 2018 at 11:51 am #999314This reply has been marked as private.August 20, 2018 at 12:08 pm #999321This reply has been marked as private.August 21, 2018 at 10:13 am #999719Hi ProTravelGolf,
I see that you’re hiding the submenu for the screen sizes below 767px and it is there for the screens above, it is not a burger and sticks to the top.
Which part is not working for you?
Best regards,
VictoriaAugust 21, 2018 at 11:03 am #999751This reply has been marked as private.August 22, 2018 at 12:46 pm #1000276Hi ProTravelGolf,
Best regards,
VictoriaAugust 22, 2018 at 1:08 pm #1000289Victoria,
Do you have the code for my question above re: the padding around the words on full width submenu?
Many thanks
August 23, 2018 at 12:23 pm #1000703Hi ProTravelGolf,
I still do not understand the which space and how you need to adjust and so I cannot give you the code.
Can you please make a mockup?
Best regards,
VictoriaAugust 23, 2018 at 1:05 pm #1000714This reply has been marked as private.August 23, 2018 at 4:12 pm #1000807Hi ProTravelGolf,
Ok, thank you.
If just the horizontal
@media only screen and (max-width: 990px) #top #av-custom-submenu-1 .av-menu-button > a .avia-menu-text { padding: 9px 4px; } }
if padding in general
@media only screen and (max-width: 990px) #top #av-custom-submenu-1 .av-menu-button > a .avia-menu-text { padding: 4px; } }
If you need further assistance please let us know.
Best regards,
Victoria- This reply was modified 6 years, 4 months ago by Victoria.
August 23, 2018 at 6:53 pm #1000881Victoria,
Brilliant that has worked great. Thank you so much for your support and patience!!
Best regards
August 23, 2018 at 7:05 pm #1000893Hi,
I’m glad you were able to get this resolved. If you need additional help, please let us know here in the forums.
Best regards,
Jordan Shannon -
AuthorPosts
- The topic ‘Full Width Submenu Force Mobile at Specific Width’ is closed to new replies.