Why does my product page drop down when selecting a variant?

[Ramon6]

So when I choose a different variant of my product, the page seems to drop down (I think to the height of the product picture) ((this product only contains 1 picture))

When I turn on sticky media the page would drop down all the way until you can’t see the variants no more.

Now my question is: Is there a way (a code maybe) to make sure that if you’d choose another variant, the page won’t drop down anymore? See the attached video as an example.

Shopify page drops down when selecting variants

@LitExtension

[PageFly-Victor]

This is PageFly - Free Landing Page Builder. I would love to provide my recommendations for your store based on 6 years of providing solutions for about 100.000 active Shopify merchants.

Regarding your concern about to prevent pagge automatically scroll when changing variant, before making any changes please help me to duplicate your theme first for a backup version and follow my steps below

Step1: Online stores > Themes > Edit code > search for global.js

Step2: Press Ctrl + F or Cmd + F to search the keyword : scrollintoview

Step3: comment the code like the screenshot:

Hope this will help you solve the issue

If you feel my answer is helpful, like it or mark it as a solution. Let me know if you have any questions.

Best regards,

PageFly

[StephanIon]

Hello, seems to me that i have the same problem, and i can’t find the code. Can you help?

[Vyom]

Thanks but how to do the same in “BOOST” theme? There is no global.js file in this theme. Please help.

[Vyom]

Did you find the solution with no code file?

[vvr]

For Dawn 8.0.1 the code can be found in media-gallery.js on line 47. Just do as I did:

If you don’t use dawn, go through all of the .js files looking for something similar and add a “//” to the line then test it.

[Osmoz]

Thanks for the help !

It worked perfectly for me under Dawn 10.0.

(The line has now simply become 53).

[katiejem]

Hello, in Dawn version 11.0.0 how can i fix this problem?

[Pimp]

Mine worked on Dawn 11.0.0

Add two:

//

Before the following code:

activeMedia.scrollIntoView({ behavior: ‘smooth’ });

Complete it should look like the following:

// activeMedia.scrollIntoView({ behavior: ‘smooth’ });

NB: (others above have also shown what it should look like)

My code was found in:

media-gallery.js

Found on code line:

#53

Best,

Pimp

[jg80]

Works exactly as you described on Dawn 12.0.0

Thank you.

[Minouw0w]

Hi,

Im using Sense 10.0.0 and I don’t have the same code as you.

Here’s mine :

I hope you’ll see my message.

Thank you