스크롤 애니메이션

[홍승진]

선생님 안녕하세요!
자바스크립트 강의 거의 다 듣고
이제 포폴 만들고 있는데 기능 구현하기가 쉽지 않네요
구글링을 해도 답이 안나와서 힌트라도 주십사 질문남겨요

https://benjaminrighetti.com/
따라하려고 하는게
스크롤할때마다 글자가 한글자씩 위로 올라가는 애니메이션입니다.
css keyframe으로 움직이고 끝나는 애니메이션 말고 스크롤 값에 따라 상대적으로 움직이는 걸 만들고 싶습니다.

document.querySelectorAll('.intro__tit).forEach(el => {
  let splitIntroTit = el.innerText.split('').join('</span><span>');
  splitIntroTit = '<span>' + splitIntroTit + '</span>';
  el.innerHTML = splitIntroTit;
 });

const titleRow1 = document.querySelectorAll('.intro__tit span');

for(let i=titleRow1.length-1; i>-1; i--){
?????????????????
}
일단 글자를 span으로 쪼개 담고
for(let i=titleRow1.length-1; i>-1; i--){
}
끝에서부터 올라가야하니까
for 반복문을 역순으로 돌려서 해보려했는데
글자마다 차이나게 움직이는 걸 
window.scrollY 값이랑 어떻게 연동해서 식을 짜야하는 지 빡대가리라 너무 어렵네요.
힌트 주시면 감사하겠씁니다.

[codingapple]

반복문부터 쓰면 누구나 어렵습니다

마지막글자는 현재스크롤높이 x 5만큼 위로 움직여주세요
마지막-1글자는 현재스크롤높이 x 4.5만큼 위로 움직여주세요
마지막-2글자는 현재스크롤높이 x 4만큼 위로 움직여주세요
마지막-3글자는 현재스크롤높이 x 3.5만큼 위로 움직여주세요
대충 한글로 어떻게 동작할지부터 정의한 다음 코드로 옮기면 됩니다

[홍승진]

답변 듣고 해결했습니다! 감사해요!
무조건 한글부터...

[글쓴이]

글