URL with hash not scrolling to proper section on page load about asscroll

[ashthornton]

Hi @jbarkun, I haven't tested this but you may just need to update ASScroll's internal scroll positions as the GSAP tween progresses like:

gsap.to(window, {
	duration: 0.6,
	scrollTo: {y: $(hash_target), offsetY: scrollOffset},
	onUpdate: () => {
		ASScroll.Scroll.scrollPos = y
		ASScroll.Scroll.smoothScrollPos = y
	}
});

But it's likely that animating the native window position like that will conflict with ASScroll. If you want to animate the scroll position you are better off doing something like this:

const scroll = { value: 0 }

function scrollToSection() {
    scroll.value = -ASScroll.smoothScrollPos

    gsap.to(scroll, {
        value: targetPosition, // targetPosition being the pixel position of where to scroll to
        duration: 1,
        ease: 'expo.out',
        onUpdate: () => {
            ASScroll.scrollTo(scroll.value)
        }
    })
}

If you want to snap to the scroll position like the native browser behaviour for anchor links you can just set the internal scroll positions like so:

ASScroll.Scroll.scrollPos = y
ASScroll.Scroll.smoothScrollPos = y

Let me know how you get on.

[jbarkun]

Thanks for your help! I ended up taking your final suggestion, since animating the scroll seemed to be a little wonky on some page loads.

Here's the final code for anyone who has the same issue:

var hash = window.location.hash.substr(1);
if ( hash.length ) {
	var hash_target = $('#' + hash);
	if (hash_target.length) {
		var init_scroll_pos = $(hash_target).offset().top;
		asscroll.Scroll.scrollPos = -init_scroll_pos;
		asscroll.Scroll.smoothScrollPos = -init_scroll_pos;
	}
}

[ashthornton]

No worries @jbarkun! You're the second person that has needed this so I think I'll add a method to snap to a scroll position rather than lerp to it like what .scrollTo() does.