How can I add a hover effect to change the main image like Amazon?

Topic summary

A user is seeking help to implement a hover effect for product image thumbnails, similar to Amazon’s functionality. Currently, their site requires clicking thumbnails to change the main product image, but they want to switch to a hover-based interaction instead.

Key Details:

  • The desired behavior: hovering over thumbnail images should update the main product image
  • Current behavior: click-based thumbnail navigation
  • Context: Shopify store with third-party theme
  • Tags suggest this involves custom CSS/HTML modifications to the product page

Status: The question remains unanswered with no solutions or guidance provided yet. The user appears frustrated with the current click-based implementation and is actively seeking technical assistance to modify their theme’s image gallery behavior.

Summarized with AI on November 16. AI used: claude-sonnet-4-5-20250929.

How do I can add a hover effect of thumbnail and when we hover over thumbnails the main Image should change like Amazon.com My current functionality is on click But I am frustrated with this Please help me How to solve this Problem.

Site link https://www.solorugs.com/collections/best-sellers/products/variation-s3386

Please help me!!!

Best regards!

HaseebJoiya