How decrease opacity when scroll number increase

JavaScript
1

I have the scroll position. 0 a 300. At position 300 I want to opacity set to 0.
And if the scroll is at position 0 (at the top) opacity set to 1.

If have to find the way to decrease 1 to 0 opacity when the scroll number increases about 0 to 300.
Thanks

Don’t need to put the code, maybe is distracting. Only I need pure mathematics XD

2

at 0, you want opacity 1?
at 300, you want opacity 0.
that means you want to split the range 1 by the domain 301
(the fraction of 1/301 is assigned therefore to each position in the scroll)

that is, each time the scroll advances 1 point, from 0, the opacity should decrease by 0.00332

or each time the scroll goes down from 300 by 1 point, the opacity should -increase- by 0.00332

1 Like