This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Gordon Mei
Posted Apr 27 - Read on Facebook

I'm a bit unclear about what the args mean for Utils.modulate

For example:
profilepic.scale = Utils.modulate(scroll.scrollY, [0, 100], [1, 0.3], true)

So far, I can glean that we're scaling down to 30%.


Derek Mack

In this example, when scrollY is 0 then the profile pic scale is 1 (100%). As the content is scrolled, scrollY increases. When it has been scrolled 100 pixels, the profile pic is scaled to 0.3 (30%). A value in between, like a scrollY value of 50 would equate to a scale of 0.65 (65%) and so on.

The idea is to map the first set of values as a minimum and a maximum (of scrollY in this instance) to the second set of values with the minimum and maximum you'd like them to be (scale in this instance)

Gordon Mei

Thanks, Derek! Quick follow-up, what's the point of setting the second array's values if we can override it with "false" as the boolean value (in this scaling case)?

Derek Mack

It's a limit. By setting it to 'true' once you scroll past 100 that the profile pic doesn't keep scaling. Setting it to 'false' will keep scaling the picture at the same ratio set by the values in the [ ] brackets

Read the entire post on Facebook