Responsive top menu

Tagged: ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #2412
    Errlogerrlog
    Member

    Hi,

    when i scroll the page, the top menu won’t follow. I can get down the page and if i wan’t to see the top menu, i have to go back up again.

    The top menu works on a normal window when i scroll, but in responsive it doesn’t follow and stay at the top of the page to make the navigation easier, even in the demo.

    Test on a Samsung Galaxy S2 default internet browser.

    Do you have any idea why?

    Thanks

    #2422
    Livemeshlivemesh
    Keymaster

    The sticky menu is intentionally disabled in smartphones lesser than seven inch due to space constraints. In iPhone, you can touch the top bar of the browser to instantly navigate to the top and then navigate to the desired location by invoking the right menu. This was the reason why both sticky menu and back to top button are disabled for phones.

    In Android, I am not sure there is something like this available natively. If you need the sticky menu to be open for mobile browsers or want to at least have the back to top button, pls have a look at the js/main.js file at line number 473 (for back to top) and line number 82 for sticky menu (modify width conditional to something like 200 instead of 768). You will also need to remove the following CSS from css/responsive.css file at line number 93 –

    #header.sticky { display: none !important; }
    
    #2425
    Errlogerrlog
    Member

    Thanks! The back to top will make the job 😉

    What if i want that the ‘list’ icon stay on top when i’m on a mobile? So I’ll just have to click on it to see the menu expand?

    If i modify the main.js at line 82 the whole menu will show (like on a normal screen) and I would like to have the expandable menu when i scroll down the page.

    I don’t know if it’s possible to do that.

    Thanks again!

    #2446
    Livemeshlivemesh
    Keymaster

    Sorry, expandable menu in the sticky menu is not practical since clicking on the mobile menu icon will only expand the menu in the header while you would have navigated far down below. Users will be confused if we jump suddenly to the header upon clicking the expand button.

    Back to the top is a better solution from usability perspective. If you need sticky menu, my advice would be remove the expand button from the sticky menu for mobile, probably remove the logo also to address space constraints and just have a single line of navigation for mobile. Thanks

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘Appdev Theme Support’ is closed to new topics and replies.