• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

load 이벤트시 첫 비디오 이미지가 뜨네요.

23.04.06 17:46 작성 조회수 323

0

window.addEventListener('load' ... 중략sceneInfo[0].objs.context.drawImage(sceneInfo[0].objs.videoImages[0], 0, 0);

안녕하세요.

작업하다 이상해서, 강의자료도 같이 확인해보니 중간에 새로고침시 videoImages의 첫 이미지가 잠시 뜨는데, 아마 위의 코드 때문이 아닌가 합니다. 저 부분은 첫 scene의 장면임에도 불구하고, 뜬다는 것은 찰나이긴 하지만, 첫영역부터 순간적으로 중간으로 이동하면서 나타나는 현상같기도 한데, 이게 컴퓨터의 성능차이일수도 있다는 생각이 들기도 합니다. 저만 이런건지 모르겠습니다만..

저 코드를 제거하고 중간에서 새로고침해보니 안보여서 문제가 없지만, 최상단 첫화면에서 새로고침하면 이미지가 안보이니 또 문제더군요.

그래서 위 코드를 제거후, 새로고침시 조금 스크롤되는 코드에서 추가 조건문(else)를 붙여서 아래와 같이 수정해보았습니다.

   if (tempYOffset > 0) {
      let siId = setInterval(() => {
          scrollTo(0, tempYOffset);
          tempYOffset += 5;
          if (tempScrollCount > 20) {
              clearInterval(siId);
          }
          tempScrollCount++;
      }, 20);
    } else {
      sceneInfo[0].objs.context.drawImage(sceneInfo[0].objs.videoImages[0], 0, 0);
    } 

이렇게 처리하니 문제가 없는 듯 한데, 이게 저한테만 생기는 문제인지, 아니라면 제가 위와 같이 처리한 방법이 맞는것인지 궁금합니다.

 

답변 2

·

답변을 작성해보세요.

0

말씀대로 환경에 따라 조금씩 차이가 발생할 수 있을 것 같습니다.
기능 구현에 정답이라는게 없기 때문에, 충분히 좋은 시도라고 생각합니다!
강의에서 만드는 예제가 100% 완벽하다고는 할 수 없기 때문에, 그런 식으로 보완해 주시면서 공부하시면 더 좋을 것 같다는 생각입니다.

0

인프런 AI 인턴님의 프로필

인프런 AI 인턴

2023.05.24

안녕하세요, 인프런 AI 인턴입니다.

영상 첫 이미지가 잠시 뜨는 문제는 일부 브라우저에서 발생할 수 있는 문제로 극복하기 어려운 문제입니다. 하지만, 추가된 코드로 영상 첫 이미지가 보이지 않는 문제를 해결할 수 있게 되었는데, 아마도 문제가 해결된 것으로 생각됩니다.

조금 스크롤되는 코드에서 추가 조건문(else)를 붙여서 아래와 같이 수정했다는 것은, 대단히 좋은 아이디어이고, 문제가 되는 부분을 정확히 잡아내신 것 같아 적극적으로 추천합니다.

그러나, 이 코드가 모든 브라우저에서 작동하는지는 보장하기 어렵기 때문에, 추후에 다른 문제가 발견될 경우 우선 위의 코드에서 부터 검토를 진행해 보셔야 될 것 같습니다.

감사합니다.