Highlight Menu Item on Active for scrolling to current page

  • Resolved grimdesigns

    (@grimdesigns)


    10 years, 4 months ago

    I have placed the “shiftnav-highlight” on my menu css items and that seems to have the desired effect if you are navigating to different pages where that is active.

    What I am trying to accomplish is this:
    i’m using shiftnav to navigate to different items on the page (long vertical page) and if the user scrolls using the scrollbar, I want to highlight the associated nav item on the menu if they are currently viewing that section. Example, the about us section is currently in the viewport, so highlight the “about us” section in the menu.

    Can this be accomplished?

    https://www.ads-software.com/plugins/shiftnav-responsive-mobile-menu/

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author sevenspark

    (@sevenspark)

    Hi grimdesigns,

    That’s not something ShiftNav does out of the box, but you could use some custom javascript to assign and remove that class as the user clicks the scrollable menu items.

    Best,

    Chris

    Thread Starter grimdesigns

    (@grimdesigns)

    Hi Chris,

    I was able to figure it out. I used a plugin called Page scroll to id in combination with shiftnav.
    It still took some tinkering with the CSS and JS but it worked out.

    Thanks for the help.

    Plugin Author sevenspark

    (@sevenspark)

    Great, glad to hear you got it sorted out! ??

    Best,

    Chris

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Highlight Menu Item on Active for scrolling to current page’ is closed to new replies.