HTML5 Video API 활용: 나만의 자바스크립트 커스텀 비디오 플레이어 만들기

우리가 웹 서핑을 하다 보면 수많은 동영상 콘텐츠를 마주하게 됩니다. 하지만 브라우저가 기본적으로 제공하는 비디오 컨트롤러는 기능적으로는 충실할지 모르나, 디자인 측면에서는 항상 아쉬움이 남습니다. 구글 크롬, 사파리, 엣지 등 브라우저마다 제각각인 인터페이스는 블로그나 웹사이트의 전체적인 톤앤매너를 해치기도 하죠. 오늘 19번째 프로젝트에서는 HTML5의 Video API를 직접 제어하여, 투박한 기본 컨트롤을 숨기고 우리만의 디자인과 기능을 입힌 ‘자바스크립트 … 더 읽기

CSS 변수와 Math 객체로 구현하는 자바스크립트 아날로그 시계

안녕하세요! 그동안 우리는 텍스트 기반의 데이터와 간단한 로직들을 위주로 다뤄왔습니다. 하지만 웹 개발의 세계는 정적인 텍스트를 넘어 역동적인 시각적 결과물을 만들어낼 때 그 진가가 드러나곤 하죠. 이번에 제가 도전한 주제는 바로 ‘자바스크립트 아날로그 시계’입니다. 단순히 현재 시간을 숫자로 보여주는 디지털시계는 누구나 쉽게 만들 수 있습니다. 하지만 시계바늘이 중심점을 기준으로 회전하고, 초침의 움직임에 따라 분침과 시침이 … 더 읽기