justintime

Thanks. I fixed it in another way, by removing the background color when it was not needed. That way, no visible strange edges on my images.

Thanks. clearProps at the end helps. But I realize that the problem is broader and outside of gsap. Even a CSS animation on opacity creates this kind of lines along the image during the animation. Not sure what the issue is here...

I have this animation on an image contained in a parent that has a background color and overflow hidden. At rest, the image fills the container, so the background color is not visible. gsap.timeline({ repeat: 1, yoyo: true }) .to(element, { scale: 1.1, duration }) This makes an image zoom a bit and return back to its original state. When it finishes, unfortunately the image has some tiny left and right borders that make the color of the parent visible. The problem is that after the animation, some styles added by gsap are kept on the image element: translate: none; rotate: none; scale: none; transform: translate(0px, 0px); This is the transform property that creates these parasite lines around my image. If I comment it in devtools, they go away.

That was what I understood

My motivation is mainly pragmatic. I have existing code that works very well with CSS and I'm in the process of adding gsap for complex animations. The time I have and my priorities mean that if I can keep existing code without having to migrate it, that's always better. But I agree that gsap is much more powerful.

Thank you very much. Did I miss it in the documentation? If it's not there, it would be perfect to know what the parameters are for the different stock css easings. So, I tried, and even if better, it's not perfect. Note that if I migrate my css transition to a gsap solution, then it becomes perfect. So there is something between the 2 worlds that seem difficult to ... "synchronize"?

Hi, I have an existing CSS transition that is set to ease-in-out to animate a specific element. I am also using gsap to animate a second element, close to the first one. However, with the gsap easing, I am not able to have the 2 elements transition the same way. If I want to keep the ease of use of the CSS transition on the first element but use the power of gsap on the second element and have easing the same on both, how do I do? Thanks