작성
·
423
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 인턴입니다.
영상 첫 이미지가 잠시 뜨는 문제는 일부 브라우저에서 발생할 수 있는 문제로 극복하기 어려운 문제입니다. 하지만, 추가된 코드로 영상 첫 이미지가 보이지 않는 문제를 해결할 수 있게 되었는데, 아마도 문제가 해결된 것으로 생각됩니다.
조금 스크롤되는 코드에서 추가 조건문(else)를 붙여서 아래와 같이 수정했다는 것은, 대단히 좋은 아이디어이고, 문제가 되는 부분을 정확히 잡아내신 것 같아 적극적으로 추천합니다.
그러나, 이 코드가 모든 브라우저에서 작동하는지는 보장하기 어렵기 때문에, 추후에 다른 문제가 발견될 경우 우선 위의 코드에서 부터 검토를 진행해 보셔야 될 것 같습니다.
감사합니다.