Animate multiple objects with the same timeline

[camAnana]

Hi, I'm new to gsap and I'm trying to create a complex scroll animation where I need to animate multiple objects in a different way using the same timeline. 

 

This is my current code, but my issue with this is that each time I add a ".to" animation it creates a small delay between each one, and I need it to happen at the same time

gsap.registerPlugin(ScrollTrigger);

let tl = gsap.timeline({
	scrollTrigger: {
  	trigger: ".usages-scroll1",
    start: "center center",
    end: "bottom center",
    toggleActions: "restart pause reverse pause",
    markers: {startColor: "green", endColor: "red"}
  }
});

tl.to(".usage-finance", {
  x: 500
})
.to(".usage-people", {
  x: 200
});

How can I make it happen all at the same time? Thanks

[1amShaw]

Apologies for the brief answer, but have you seen this article?
(Disclaimer: I am no GSAP expert)

[Cassie]

Yep - 100% - position parameter is the way to go here!

[camAnana]

5 minutes ago, 1amShaw said:

Apologies for the brief answer, but have you seen this article?
(Disclaimer: I am no GSAP expert)

This is exactly what I needed, thanks!