I am trying to add a defaults values for my fromTo(), I tried putting defaults: {} inside gsap.timeline({}) as below
const tl_shapes = gsap.timeline(
{ defaults: { opacity: 0 } },
{ defaults: { opacity: 1 } }
);
function step_shapes_animation () {
return tl_shapes
.fromTo(
".step-2 .shapes img:first-child",
{ x: -200 },
{ x: 0, duration: duration }
)
.fromTo(
".step-2 .shapes img:last-child",
{ y: -200 },
{ y: 0, duration: duration },
"-=0.4"
);
}
I am not sure if this is the right way to do it but second element doesn't seem to work and it starts with initial opacity: 1 and I guess it is because fromTo() has 2 objects and I can't put 2 objects for defaults. I am wondering if there is a right way to do it.