Hey @nvanoort
The scroll only happens when the page loads, so youâll want to change your nav links to be absolute or relative including the slug. Whatever it takes to trigger the page refresh.
Hey @nvanoort
The scroll only happens when the page loads, so youâll want to change your nav links to be absolute or relative including the slug. Whatever it takes to trigger the page refresh.
Thanks, @DuncanHamra.
I had made those links component properties in an attempt to be able to change the type of link they were on only the services page only because my nav is a component used across the whole site, but even after removing the component properties link, I was unable to get either an absolute or relative link to force a reload of the page.
However, I did find the following Memberstack script, https://www.memberstack.com/scripts/refresh-page-after-set-duration-on-click, that when applied on that page and the custom attribute to those links (with a delay of 0), is having the desired result. It forces a refresh and then scrolls down the page to the correct tab.
Unless Iâm missing some key reason why this approach shouldnât be used, I will leave it as it is now functioning. Thanks for offering help!
Given a tab menu element with position: sticky
, the scrolling will break.
To fix this, scroll to the tab menuâs parent element instead:
Replace
top: $(tabTarget).offset().top - offset, behavior: 'smooth'
with
top: $(tabTarget.closest('.w-tabs')).offset().top - offset, behavior: 'smooth'