A wandering hour dial

One of the additional fun things about building clocks is that people start sending links to peculiar clocks. My good friend and fellow nerd Dave Krooshof sent me a link to this video of a night clock. It’s a clock that can show you the time when it’s dark. And it can do so in environments where all you have are oil lamps instead of electricity. The 17th century was such an environment, and the clock in this video was built back then. The fact that it can show the time at night is interesting, but I found the mechanism inside it to be even more interesting. And I assumed that it could be made with CSS, and so I did.

Numbers on a chain

The wonderful narrator in this video will open the clock step by step, so it’s really worth it to watch all of it. In the end it will show the brilliant mechanism that this clock uses. It’s called a wandering hour dial: the hour wanders around the clock, instead of the hands. It’s a pretty simple but very ingenious mechanism, made from a chain and a disk.

First of all there’s a chain with all the numbers which simply turns around. Here’s an example (it only works on larger screens, sorry).

The trick is in the disk that’s placed before this chain. There are two holes in it. The correct hour appears behind a hole. Here’s an example of this mechanism, turning in a very nice fast forward pace.

A few hours later I slowed it down, set it to the correct time and added some minute-indicators and a magic pointer. In the original clock the mechanism is covered. Which in a way is a shame. So in my version I’ve left it uncovered. Here it is, a wandering hour dial for your web browser.