Decreasing size and changing text at the same time on sroll

[natom88]

Hi,

 

I want to do the reverse of what is in the codepen (in orange).

And, having text inside, changing while scrolling inside the orange view. 

Can someone help me please?

 

Thanks.
Nadia

See the Pen oNBGzOE by snorkltv (@snorkltv) on CodePen

[Cassie]

Hi Nadia! ☺️

 

You can change the tween method to 'to' instead of 'from' and it will animate to those values instead of from those values.
 

.to(".orange", {
  scale: 0.5, 
  ease: "none"
})

I recommend checking out the getting started page. After that, if you'd like any more assistance could you post a minimal demo of what you've tried? 

[Carl]

Hi Nadia,

 

In addition what @Cassie suggested I'm curious what part exactly you need help with. Do you have a basic animation already set up that you just need to control with scroll? Do you know how to animate text changing without scroll? Do you have an animation of a shape changing size? 

 

We're happy to help you along the way, but it's difficult to know exactly where to start and we're not in the habit of just building projects for people.

 

If you need help "getting text to change" perhaps this video will help you. But even something as basic as "changing text" can be done a dozen different ways.

 

 

demo

See the Pen XWJzrQq?editors=0010 by snorkltv (@snorkltv) on CodePen

 

 

And as Cassie said, it's much easier to help you if you provide a demo showing what you are working on so that we know exactly which parts need changing.