Clicking on Product Photo Thumbnails Shifts Page Down

MitchellFly
Excursionist
31 0 3

Hi all,

We're encountering an issue where after a user clicks between thumbnails a couple of times, the page automatically shifts down to the bottom of the page.

Is there a solution for this? Our page URL is https://footyintl.com

Thank you in advance!

Replies 10 (10)
made4Uo
Navigator
210 11 77

@MitchellFly 

Do not use <a href> to call your images. There are several ways to call the large images with the thumbnails. You can use dataset or loop.index

I do not work with Shopify. I am not looking to be hired or being paid. Just wanted to help.
LitCommerce
Trailblazer
262 68 70

Hi @MitchellFly,

I checked and it could be Focus error in JS. Please go to assets > theme.js file, find 'productThumbnailSwitch:', and remove code: https://i.imgur.com/MtwbScC.png

Hope it helps!

 

LitCommerce - The Most Simple & Affordable Multi-channel Selling Tool.
Effortlessly sell on biggest marketplaces like Amazon, Etsy, eBay, Facebook etc with bulk listing tool, real-time sync & smart order management. Use LitCommerce free for 1-year now!
MitchellFly
Excursionist
31 0 3

Hi there--apologies for the late response! I went through and found that code, deleted it, and still had the same result where clicking between photos would send the pageview to the bottom. Thank you though!

MitchellFly
Excursionist
31 0 3

@LitCommerce this is what our code looks like currently (I added in the deleted code here). Not sure if this helps, but it's what we're looking at!

 

Screen Shot 2021-11-28 at 11.25.59 PM.png

LitCommerce
Trailblazer
262 68 70

Hi @MitchellFly,

This is just a suggestion, can you remove it and check again? https://i.imgur.com/jHPqOX4.png

 

LitCommerce - The Most Simple & Affordable Multi-channel Selling Tool.
Effortlessly sell on biggest marketplaces like Amazon, Etsy, eBay, Facebook etc with bulk listing tool, real-time sync & smart order management. Use LitCommerce free for 1-year now!
Ketan_Mistry
Shopify Partner
12 0 5

This is probably because the images are not the same height? Adding a fixed height to the image container would help, but the best solution is to make sure all the images are the same dimension.

I'm a British Web Designer/Developer and Graphic Designer with 20+ years of industry experience currently residing in Melbourne, Australia.
MitchellFly
Excursionist
31 0 3

Thank you, Ketan! Do you know how we can set fixed image heights for our product photography?

MitchellFly
Excursionist
31 0 3

Hi @LitCommerce ,

 

I tried deleting it and didn't have any success--still faced the same issues. Thank you for your input!

 

- Mitchell

Ketan_Mistry
Shopify Partner
12 0 5

Hi @MitchellFly, the easiest and the best solution is to upload all your images at the same size, e.g. 1024 x 1024px. If you do it this way, there'll be fewer layout issues and everything is consistent. It can be done using CSS, but it gets very complicated.

I'm a British Web Designer/Developer and Graphic Designer with 20+ years of industry experience currently residing in Melbourne, Australia.