Shopify Dawn Disable Autoscroll On Variant Change
July 18th, 2022
While implementing a scroll-spy for a client, the page kept scrolling to the top.
Initially, I figured it had been caused by code I wrote but after removing all my code I quickly realized this was built-in behavior.
The function to remove is in setActiveMedia on line 47 of media-gallery.js in the assets folder of the theme.
if (!this.elements.thumbnails || this.dataset.desktopLayout === 'stacked') {
activeMedia.scrollIntoView({behavior: 'smooth'});
}
Comment this line out and it will no longer scroll automatically when a new variant is selected.
The function commented out.
This worked for me in Dawn 3.0.0 – 5.0.0 and likely works above those versions as well.
- Filed to:
- Code,
- Javascript,
- Shopify
Comments
This works on Craft as well. Thank you!
Awesome happy to hear they’ve reused that snippet!
Legend.
Thank you. Was driving me crazy. When selecting a variant the screen was jumping all over the place.
It was so irritating to find the solution which is why I made this post in the first place haha
love you