인프런 커뮤니티 질문&답변

안녕하세요

강사님

이해가 되지 않아서 질문드립니다.

저는 조건을 한글로 생각해서

저렇게 주석으로 정리를 해놨습니다.

if문의 조건을 봤을땐 조건이 맞아서 console.log에 scroll 라는 변수도 정상적으로 찍힙니다.

제가 궁금한것은

2개의 조건이 스크롤 할때마다 맞는데 어떻게

스크롤 값이 526 이 되거나 넘어가면 pageNum의 값이 증가하는걸까요?

많이 헷갈려서 이부분만 여러번 보는듯합니다.

아니면 저의 해석이 잘못된 걸까요?

// 1. 스크롤의 값이 sectionNum의 Top 시작 값 - 화면 높이 값/3 보다 큰가? = 스크롤의 값이 -250보다 큰가?
// 2. 스크롤의 값이 sectionNum의 Top 시작 값 - 화면 높이 값/3 + sectionNum의 전체 높이 값 보다 작은가? = 스크롤의 값이 526 보다 작은가?

for(let i = 0; i < maxNum; i++){

                // 1. 스크롤의 값이 sectionNum의 Top 시작 값 - 화면 높이 값/3 보다 큰가? = 스크롤의 값이 -250보다 큰가?
                // 2. 스크롤의 값이 sectionNum의 Top 시작 값 - 화면 높이 값/3 + sectionNum의 전체 높이 값 보다 작은가? = 스크롤의 값이 526 보다 작은가?
                if(scroll > sectionNum[i].offsetTop - window.innerHeight/3 && 
                scroll < sectionNum[i].offsetTop - window.innerHeight/3 + sectionNum[i].offsetHeight){
                    pageNum = i;
                    console.log(scroll);
                    if(scroll > sectionNum[i].offsetTop - window.innerHeight/3){
                        console.log('큼1')
                    }
                    if(scroll < sectionNum[i].offsetTop - window.innerHeight/3 + sectionNum[i].offsetHeight){
                        console.log('큼2');
                    }
                    
                    // console.log(sectionNum[i].offsetTop); // 8 785 1562 2339
                    // console.log(window.innerHeight/3) // 258
                    // console.log(sectionNum[i].offsetHeight); // 777
                    // 8 - 258 = -250 
                    // -236 + 734 = 527
                    // console.log(sectionNum[i].offsetTop - window.innerHeight/3 + sectionNum[i].offsetHeight); // 526
                    // console.log(scroll)
                    // console.log(pageNum);
                    // console.log(sectionNum[i].offsetTop - window.innerHeight/3) // -250

                    // 한번 돌았으면
                    break;
                }
                
            }