Code needed for video hover.

Shopify Partner
9 0 2

Website preview:




On my Shop page, I have 2 large images - each image acts like a button, linking to a different collection.

Rather than images, I now want to use two short looping animation videos (must be responsive + muted + controls hidden + autoplay). I have somewhat managed to achieve this, but as you'll see, there is an issue I need help with:


The darkened hover reveals the square dimensions of the video, which I don't want. Is there a way to apply the hover effect to the entire half section (in the same manner as is applied to the left-hand image)? Below, is an example of how the hover should fill the entire right half section.




Any help or suggestion would be appreciated. Thanks!




Reply 1 (1)

Shopify Expert
3477 461 518

Hi @ShootsDraws ,

This preview link has expired.
Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development