Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #764790

    Hi
    Is it possible to have the burger menu only shown when you start scrolling?

    So when opening a page, the normal menu is on top.
    When you start scrolling, it gets replaced by the burger menu.

    Thanx
    T

    #765385

    Anyone? ;-)

    #765397

    Hi tomcarmans,

    Can you please give us a link to your website?

    Best regards,
    Victoria

    #766025

    Hi, link below …

    • This reply was modified 3 years, 6 months ago by  tomcarmans.
    #767455

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (min-width: 990px) {
    .js_active.html_burger_menu #avia-menu > li, .header-scrolled .av-burger-menu-main {
        display: block!important;
    }
    .js_active.html_burger_menu .header-scrolled #avia-menu > li, .av-burger-menu-main {
        display: none!important;
    }
    }
    

    Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field.

    Best regards,
    Yigit

    #767470

    Hi Yigit

    Both menus are shown when opening page: https://www.dropbox.com/s/mxg1yj7xdwfgjkk/Screenshot%202017-03-27%2015.10.47.png?dl=0
    When scrolling, both disappear: https://www.dropbox.com/s/oqtv7q297mu85rw/Screenshot%202017-03-27%2015.11.32.png?dl=0

    Should be:
    – Full menu is show when opening page
    – When scrolling: full menu hidden, burger menu shown
    On mobile: always burger menu

    Thanks a lot!

    Tom

    #767473

    Hi!

    Can you please create a temporary admin login and post it here privately so we can look into it?

    Regards,
    Yigit

    #767478

    Hi Yigit
    See in private content …

    #767479

    Hi!

    Login credentials are not working for me. Could you please check them once again? :)

    Best regards,
    Yigit

    #767484

    New password in pvt

    #767499

    Hi!

    I changed the code to following one

    @media only screen and (min-width: 990px) {
    .js_active.html_burger_menu #avia-menu > li { display: block; }
    .js_active.html_burger_menu .header-scrolled #avia-menu > li.av-burger-menu-main {
        display: block!important;
    }
    .js_active.html_burger_menu .header-scrolled #avia-menu > li {
        display: none;
    }
    .js_active.html_burger_menu #avia-menu > li.av-burger-menu-main { display: none; }
    }

    and corrected the errors you had in style.css file. Please review your website now

    Best regards,
    Yigit

    #767505

    Works like a charm!
    Thanks a lot, Yigit, great service!

    #767730

    Hi,

    You are welcome!
    Let us know if you have any other questions or issues :)

    Best regards,
    Yigit

Viewing 13 posts - 1 through 13 (of 13 total)

The topic ‘Burger menu only on scroll’ is closed to new replies.