🙆‍♀️ FE/JavaScript

javascript30-02

wnwlals13 2021. 2. 25. 14:13

 

index.html

⭐️ Point

- transform-origin: 100%;  : 시계바늘이 rotate하는 위치를 지정 (50%이면 중간, 100%이면 오른쪽 끝)

- transform: rotate(90deg);  : 시계바늘이 12시를 기준으로 회전할 수 있도록 기본 지정

- transition: all 0.5s;  : 움직임이 부드럽게

- transition-timing-function: cubic-bezier(0, 2.55, 0.66, 1);  : second-hand가 약간 튕기는 듯한 느낌을 주는 CSS

- const now = new Date() : Date객체를 생성해 오늘 날짜를 가져올 수 있다. (Sun Dec 17 1995 03:24:00 GMT...)

- Date객체에서 자주 쓰이는 메서드  -> getFullYear(년도), getMonth(월), getDay(일), getHours(시간), getMinutes(분), getSeconds(초)

- setInterval(function, sec) : 매초마다 움직이게 하는 Web API