There are a few things at play which is causing the vibration. The root of the issue is you have two competing animations - the group moving forward and the element moving backwards. You’ve set the amount of movement (600px) to be the same and are using linear transitions for both, which is good. However, the zoom factor of the scale is probably causing a fractional rounding issue and there might be a couple other things at play. The easiest way to generally resolve it would be to:
- Set the animation duration to be 5 seconds instead of 5.15. This makes the math cleaner so it is more likely to land on whole numbers - (600px / (5s * 60fps) = 2px per frame exactly).
- Uncheck ‘Position with CSS left/top’ in the document inspector. This allows non integral rendering so any small differences aren’t as likely to be noticed.
However, given your animation the better way would probably be to simply put the image in a group with overflow set to hidden, and then expand the group so the image is uncovered.