Multiple Timezone Analog Clocks – shonir-analog-clock

Have you ever wanted many analog clocks on your website, showing the current local time of all the major cities in the world? If so, you can use the shonir-analog-clock library.

shonir-analog-clock is a tiny Javascript library that can be used to generate analog clock faces that display the time in multiple time zones.

How to use it:

1. Import the stylesheet shonir_analog_clock.css and JavaScript shonir_analog_clock.js.

<link rel="stylesheet" href="css/shonir_analog_clock.css">
<script src="js/shonir_analog_clock.js"></script>

2. Create world clocks using the int_shonir_analog_clock(id, time_zone) method.

<div id="New_York" class="analog_clock">
  <div>
    <div class="info date"></div>
    <div class="info time"></div>
  </div>
  <div class="dot"></div>
  <div>
    <div class="hour-hand"></div>
    <div class="minute-hand"></div>
    <div class="second-hand"></div>
  </div>
  <div>
    <span class="h_3">3</span>
    <span class="h_6">6</span>
    <span class="h_9">9</span>
    <span class="h_12">12</span>
  </div>
  <div class="diallines"></div>
</div>

int_shonir_analog_clock("New_York", "America/New_York");