Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #504016

    I would rather not use the responsive layout as it makes everything look funny on the mobile version. Fixed layout fixes this, except hover states on the menu don’t work. Is it possible to get a mobile menu button on a fixed layout?

    #504079

    Hi erusko!

    Try setting it back to responsive and then add this to your custom CSS.

    div#wrap_all {
        min-width: 700px !important;
    }
    #advanced_menu_toggle {
        right: 20px;
        position: fixed;
        top: 40px;
    }

    Cheers!
    Elliott

    #504132

    Hi Elliot,

    that didn’t seem to work.
    please see site: any ideas?

    #504208

    Hi!

    I’m seeing the mobile menu on my end (browser + nexus 4).

    What mobile device are you testing the mobile menu on?

    Cheers!
    Dake

    #504230

    chrome + Nexus 5.

    the menu comes up because it’s back on responsive layout. i’m not sure how the code changed things, excepts it makes it so you can’t resize the page to view the whole thing.

    i’d like to stay on fixed layout, but also have the menu button. is this possible? i’ve changed the site back to fixed layout and the way it was previously.

    #504245

    Hi!

    Please insert the below css into your custom css section, then adjust the left positioning as needed:

    .av_header_transparency #advanced_menu_toggle {
        display: inline  !important;
    	left: 50px !important;
    }

    Regards,
    Dake

    #504469

    Hi Dake,

    I added it in, but I can’t see any difference. Any other ideas?

    #504501

    Hi!

    May we have temporary access to your website so we can take a closer look?

    Cheers!
    Dake

    #504507

    yep

    #504950

    Hey!

    we definitely recommend to use responsive mode. I implemented this code into your Quick CSS field:

    div#main {
    width: 54%;
    }
    @media only screen and (max-width: 989px) {
    .responsive.html_mobile_menu_tablet .container #advanced_menu_toggle, .responsive.html_mobile_menu_tablet #advanced_menu_hide {
    left: 250px;
    }}
    

    and now it’s working fine for me. Can you confirm? or which changes do you still need?

    Cheers!
    Andy

    #505006

    the mobile menu always came up on responsive mode… so i’m not sure why you needed to add additional code to the quick CSS? i have edited this back out.

    the reason i want the mobile menu to come up on the fixed layout (on mobile/tablet only) was because i liked the look of the mobile site in fixed layout better than in responsive mode. The site in responsive mode has a lot of text that’s the wrong font size, along with spacing issues, sizing and positioning problems etc… that’ll need to be fixed which could take a lot of work. that’s why i was wondering if i could stay in fixed layout, but solve the problem of the fixed layout mobile menu (submenu links not being able to be clicked) by replacing the menu bar with the responsive mode mobile menu bar button, all while staying in fixed layout. does that make sense? I have added images in the private section below, that better explains what i’m talking about.

    • This reply was modified 9 years, 2 months ago by erusko.
    #505213

    Hey!

    This is actually possible but there’s a lot of modifications involve. For example, you will have to modify the js > avia.js file to enable the mobile menu even if the theme is not set to responsive. And if you manage to enable the mobile menu on fixed layout, you will have to deal with the mobile menu styling which is not compatible with fixed layout. I think the better solution is to add a full width sub menu on mobile view to compensate for the missing sub menus in the main menu.

    Best regards,
    Ismael

    #505321

    Thanks for the reply. How would I go about implementing a full width submenu?

    #505428

    Hi!

    You can simply add Fullwidth Submenu element under Content Elements of Advanced Layout Builder to your pages and choose to hide it above 768px using following code in Quick CSS field

    @media only screen and (min-width: 768px) {
    #top .av-submenu-container { display: none !important; }}

    Regards,
    Yigit

Viewing 14 posts - 1 through 14 (of 14 total)
  • You must be logged in to reply to this topic.