inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

BBC 인터랙티브 페이지 "코로나19가 바꿀 사무실의 미래" 클론

JS part 1

forEach로 작성해봤습니다!

해결된 질문

285

Caesiumy

작성한 질문수 16

1

window.addEventListener("scroll", () => {
    let boundingRect;
    let temp = 0;

    steps.forEach((step, i) => {
      if (i > ioIndex + 1 || i < ioIndex - 1) return;
      boundingRect = step.getBoundingClientRect();
      temp++;

      if (
        boundingRect.top > window.innerHeight * 0.2 &&
        boundingRect.top < window.innerHeight * 0.8
      ) {
        inactivate();

        currentItem = graphics[step.dataset.index];
        activate();
      }
    });

    console.log("temp", temp);
  });

말 안 듣고 forEach로 만들어봤는데

temp도 2, 3 뜨는 거 보면 잘 동작하는 거 같습니다만

혹시 틀린 점이 있을까요??

클론코딩 인터랙티브-웹

답변 1

1

1분코딩

for 문으로 할 경우에는 ioIndex - 1 부터 ioIndex + 1 까지만 루프를 도는데,
작성하신 코드는 일단 루프 자체는 전체를 돌면서 if로 ioIndex를 체크하는 차이가 있습니다.
이렇게 하셔도 별 상관은 없습니다^^

내용이랑 별개로, 이렇게 다른 시도를 해보시는 것은 실력 향상에 도움이 많이 된다고 생각합니다^^

LocationPermission.denied관련 질문입니다

0

585

1

writeHead 부분

0

466

1

로그인페이지, 회원가입페이지 못들어가게하는 부분

0

516

1

강의에서 사용하고 있는 next.js 버전으로 설치는 어떻게 하나요?

0

2342

1

[공유] react-mention 항상 커서 위에 나오게 수정

2

882

3

videocontrollor dispose

0

427

1

user 과 auth에서 인증 부분

0

447

1

onlogotap함수의 video nullable관련질문

0

387

1

채팅대화에서 시간이 중복될경우 안보이게 하는방법 문의.

0

542

1

쿠키에 대해서

0

315

1

next.js 버전이 12인건가요?

0

367

1

오류났을때 참고

3

685

3

style.css 오류

0

307

1

actions 함수 관련 질문

2

400

1

새가 원래자리로 돌아올때도 transition 시간이 필요한데. 돌아올때는 바로 돌아오록 하는 Tip 이 있을까요?

0

249

0

classList 오류가 계속 납니다..ㅜㅜ

0

395

0

새 애니메이션이 작동하지 않습니다.

0

239

1

action이 true일때 실행되는데 false에서 초기화가 안되요ㅠ

0

334

2

오류가 나는데 찾지를 못하겠어요...

0

375

2

안녕하세요 ~~ 배경으로 깔린 음악이 너무 궁금하네요 ㅎㅎ

0

540

2

actions[action] is not a function 라고 뜹니다

0

993

5

첫번째랑 마지막 요가+폰하는 그림이 높이가 꼬였습니다

0

465

4

안녕하세요, step부분 문의 드립니다.

0

218

1

질문있습니다!

2

310

2