Menu icon Foundation
Scrollup when sub items appear

Hello,

I'm facing an issue when using top-bar menu for mobile, when a bottom item has been clicked sub items are loaded at top, and user doesn't see those sub items.
Is there a way to scroll up when sub-item appears.

Thanks

topbar menu mobile

Hello,

I'm facing an issue when using top-bar menu for mobile, when a bottom item has been clicked sub items are loaded at top, and user doesn't see those sub items.
Is there a way to scroll up when sub-item appears.

Thanks

This post has been closed. No new replies can be added.

Rafi Benkual over 4 years ago

Can you walk us through how we would replicate this? Have an example?

Jean-Benoit LEVIEL over 4 years ago

You can access to our web site preview at http://www-2.natureetdecouvertes.com and use the pink tab to the right "NOS UNIVERS" (in mobile / small mode).

Rafi Benkual over 4 years ago

So I click on the sub menu items further down the list, and they open, but above the viewport and the user needs to scroll back up. Is that the issue you're describing?

Jean-Benoit LEVIEL over 4 years ago

Yes That's the issue.

Jeanie Chung over 4 years ago

Hi Jean-Benoit-

You could certainly use the following code snippet to simulate the behavior you're describing:

$("li.has-dropdown").click(function() {
    $('html, body').animate({
        scrollTop: $(".toggle-topbar").offset().top
    }, 500);
});

The first part sets up an event listener to fire the scrolling behavior on anytime the user clicks on the dropdowns. Then the page will scroll up to the same level as the topbar so that the user can see the items in the menu. The number represents in milliseconds how long that transition will take.

Jean-Benoit LEVIEL over 4 years ago

Thanks, I'll try this.

Jean-Benoit LEVIEL over 4 years ago

Thanks to jeanie, it works fine.