시작할때 문이열리게했을때

Question

시작할때 문이열리게했을때 클릭했을때처럼 부드럽게 쫙 열리면서 시작하게 할려면 어떻게 하면 될까요?

Answer

activate( document.querySelector('.door:nth-child(2)') );

이 부분을

requestAnimationFrame(function () {
activate( document.querySelector('.door:nth-child(2)') );
});

이렇게 바꿔보시면 될거에요~
먼저 기본 상태가 로드된 후,
requestAnimationFrame을 통해
한 템포 늦게 activate가 실행되며 문 열리는 디자인이 적용된다고 생각하시면 됩니다.

requestAnimationFrame에 대해 더 공부해보고 싶으시면
https://youtu.be/9XnqDSabFjM
이 영상을 참고해주세요 :)