Interaction Effect - scale - Round 2

Ok guys. I don’t know, what you’ve changed with the last upadte, but this behaviour is so inconsistent especially when the window size changes

the hover over effect “scale” works even on objects, which have no effect assigned at all.

Check the large Aquarell image top right. And the buttons are a mess again. If I turn of the custom script you’ve added to the page, the aquarell does not react to hover. The buttons do something, I can’t figure out why.

Hello @VRANKOVINA,

Thank you for the inquiry.

Looks like the scroll effects conflict with the interaction effects since both use the transform property. We recommend replacing the scroll effect with an animation instead.

Best regards.

I need the scroll effect.
So what I did - I turned off the interaction scale effect. Fun fact: the aquarell still scales on hover.

I guess this is the reason:

:where(body:not(.tco-disable-effects)) .mg-4:hover, :where(body:not(.tco-disable-effects)) [data-x-effect-provider*=“effects”]:hover .mg-4 {
transform: scale3d(1.1,1.1,1.1);
}

Animation as interaction does not provide the desired effect, so I turned back the interaction scale effect on.

It’s still not clear why resizing the window’s width messes all up.

Yes, the css code above applies the scale effect to a specific image, which is why the image is still zooming in even after you disabled the interaction effect. Since the scroll effect conflicts with the interaction effect, we added a custom css class name ( x-scale-effect ) to the images with the conflicting effects, then applied this css code.

The images should now increase in size on hover and still retain their scroll effects.