Change the product image from onclick to hover?

Tourist
6 0 1

Does anyone know how to change the additional product images from on click to hover when you go over each thumbnail? 

Using Supply theme. 

1 Like
Shopify Expert
9981 85 1492

What's your plan when the customer is on a device that doesn't support hover?

★ Winning Partner of the Build a Business competition. ★ http://freakdesign.com.au
1 Like
New Member
2 0 0

I have this same question, i'm using the Out of the Sandbox - Turbo 4.2.1 theme. Instead of clicking/tapping an image in my thumbnail gallery/grid to change the main product image, i want it to happen when the user hovers over a thumbnail, and then that image stays in place as the main image until a different thumbnail is hovered. 

 

As for a plan for customers that aren't on a device supporting hover:

1. You could still click to change the thumbnail image on desktop

2. I plan to remove the thumbnail gallery on mobile and require swiping through the gallery

 

Could someone help with this code?

 

Example of functionality: https://www.theory.com/sartorial-stretch-wool-chambers-suit/suit-shop-new-tailored-wool-black.html?c...

(i also like the border around the thumbnails on hover)

0 Likes
Highlighted
New Member
2 0 0

by the way, I also want to have all of the product images change on variants on some products. I'm not sure that this is something built into Shopify Products or the Turbo theme. Should I be looking at a separate app?

0 Likes