Okay
  Public Ticket #1753686
Menu on mobile
Closed

Comments

  • Liisa Kankkunen started the conversation
    October 20, 2018 at 1:06am

    How can I make the navigation menu to stay on top of the screen when scrolling down the page on a mobile device?

  •  125
    Alexander replied
    October 21, 2018 at 2:22am

    Hi,

    Open scripts.js and edit this part of code.

    Edit this function like so:

    /* Sticky Navigation
     -------------------------------------------------------*/ 
$window.scroll(function(){
     scrollToTop(); var $navHolder = $('.nav__holder');
     if ($window.scrollTop() > 10) { $navHolder.addClass('nav__holder--sticky'); }else { $navHolder.removeClass('nav__holder--sticky'); } });


    Remove this function:

     function stickyNavRemove() { var $navHolder = $('.nav__holder'); if (!minWidth(992)) { $navHolder.removeClass('nav--sticky'); } else { $navHolder.addClass('nav--sticky'); } }


    User friendly WordPress themes

    deothemes.com

  • Liisa Kankkunen replied
    October 31, 2018 at 4:49am

    Thank you very much - that worked - Yay!


    And how do I make the navigation to be sticky - on top of the page (no padding) and 100% visible in all the screen sizes - the same idea as with the mobile question below?

    L

  • Liisa Kankkunen replied
    October 31, 2018 at 5:16am

    ..while keeping the cookies notification window to appear on top of the navigation until Confirmed button is pressed?

  •  125
    Alexander replied
    October 31, 2018 at 7:56am

    Hello Lisa.

    Try to add this CSS code to your style.css to the bottom part:

    @media only screen and (min-width: 992px)
     .nav__holder {
     margin-top: 0;
     }
.nav--sticky {
     position: relative;
     }
.nav__holder--sticky {
     position: fixed;
     }
    }

    Cheers.

    User friendly WordPress themes

    deothemes.com