I made this clock with a little help from Wes Bos' JavaScript30 tutorial although I changed a lot of the CSS design aspects of it to make it my own. I really enjoyed combining CSS and JavaScript to make something really functional.
- Creating a date object
- Using methods to get information from a date object, eg.
getSeconds() getMinutes() getHours()
- Using
setInterval
to update the time every second - Using the CSS property
transform-origin
to make the hands of the clock rotate correctly - Using CSS variables to make styling easier
- HTML
- CSS
- JavaScript
Clone the repo as instructed below
No prerequisites
- Clone the repo
git clone https://github.com/katiehawcutt/analogue-clock.git
- Run the index.html in a browser
Tell the time!