안녕하세요.지난 게시글에서 마우스 휠로 비디오의 볼륨을 조절하는 스크립트를 작성했었습니다.이 스크립트를 실제 사용함에 있어 버그 수정과 기능 추가를 조금 더 해보겠습니다. 문제 1: Video의 객체를 찾지 못하는 문제 수정Video가 재생되고 작성한 스크립트를 실행시키면 100% 이벤트가 연결되었습니다. 하지만, 일부 특정한 상황에서 Video 객체에 이벤트를 연결하지 못하는 문제가 사용하면서 발생이 되었습니다. 이 문제를 수정해 보도록 하겠습니다.원인: 적용하려는 사이트가 SPA로 제공되어 새로고침 없이 동작한다SPA(Single Page Application)으로 구성된 사이트가 왜 문제가 된 것인가?해당 스크립트는 window.addEventListener("load", ...)를 통해 웹 페이지..

안녕하세요.오늘은 웹사이트에서 재생 중인 비디오의 음량을 조절할 때 마우스 휠을 통해 조정하는 방법을 작업해보려고 합니다. 1. 들어가며데스크탑의 동영상 플레이어에서는 마우스 휠을 통해 볼륨을 조절하는 기능을 기본적으로 제공을 하고 있습니다. 개인적으로 마우스를 클릭해서 조절하거나 드래그를 통해 볼륨바를 조절하는 것보다 오히려 섬세하게 조절할 수 있다고 생각해 애용하는 기능 중 하나였습니다. 이 기능을 스트리밍 사이트(치지직)에 적용을 해보았고 고민하는 과정과 개발, 디버깅 등 작업했던 기록을 공유하고자 합니다. 2. 기능의 설계 및 중요 기능 테스트2.1. 어떤 것을 조작해야 볼륨이 줄어들까?의 controls 속성에는 기본적으로 컨트롤러를 제공합니다.소리 조절(volume)동영상 탐색(seek)일시 ..