dawn theme - can you make multicolumn images zoom in effect when u hover over them please ?

[lslelegance]

[lslelegance]

@SetuBridge_ 

[SetuBridge_]

Hello @lslelegance 

Please follow these steps:

- Step 1: Go to Online store > Themes > Actions > Edit code->asstes->base.css

.multicolumn-card .media:hover {
    -ms-transform: scale(1.3);
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
}

Output : https://nimb.ws/R9NHUx

[lslelegance]

@SetuBridge_ it worked but I wish to have it the zoom inside the image itself like this effect here :

https://lslelegance.myshopify.com/collections

thanks !

[SetuBridge_ · Accepted solution]

Hello @lslelegance 

Greetings!!

Please follow these steps:

- Step 1: Go to Online store > Themes > Actions > Edit code->asstes->base.css

.multicolumn-card__image-wrapper .media{
        overflow: hidden;
        margin: 0 auto;
    }
  
    .multicolumn-card__image-wrapper .media img {
        width: 100%;
        transition: 0.5s all ease-in-out;
    }
  
    .multicolumn-card__image-wrapper .media:hover img {
        transform: scale(1.5);
    }

 Output:  

https://nimb.ws/ymBe30

[lslelegance]

thanks !

[lslelegance]

I wish to have slideshow have my custom size not Shopify options only pls because I want to use it for products portrait size pls and smaller thanks

 

[withinkandivy]

Hello - is there a way to do this but have the images zoom in to full screen with a scroll instead?