1. This website uses cookies. By continuing to use this website you are giving consent to cookies being used.
    For information on cookies and how you can disable them visit our Cookie Usage page.
    Dismiss Notice

JavaScript CoolClock - Super nice Javascript Analog Clock

Discussion in 'Web Development' started by JavaScriptBank, Apr 26, 2010.

  1. From this super nice JavaScript analog clock, you have more than 20 layouts of analog clock to display the time on your web pages. This JavaScript analog clock has enou... detail at JavaScriptBank.com - 2.000+ free JavaScript codes

    [​IMG]
    Demo:

    javascriptbank.com/coolclock-super-nice-javascript-analog-clock.html/en/
    How to setup

    Step 1: Copy & Paste JavaScript code below in your HEAD section
    JavaScript
    Code:
    <!--[if IE]><script type="text/javascript" src="excanvas.js"></script><![endif]-->
    <script src="coolclock.js" type="text/javascript"></script>
    <script src="moreskins.js" type="text/javascript"></script>
    Step 2: Copy & Paste HTML code below in your BODY section
    HTML
    Code:
    <table align="center">
    <tbody><tr><td rowspan="2">
        <canvas style="width: 170px; height: 170px;" height="170" width="170" id="c1" class="CoolClock"></canvas>
        <br>
        <canvas style="width: 170px; height: 170px;" height="170" width="170" id="c2" class="CoolClock:chunkySwiss"></canvas>
        <br>
        <canvas style="width: 170px; height: 170px;" height="170" width="170" id="c4" class="CoolClock:machine"></canvas>
    </td><td>
        <canvas style="width: 380px; height: 380px;" height="380" width="380" id="c5" class="CoolClock:fancy:190"></canvas>
    </td></tr><tr><td align="center">
        <table><tbody><tr>
      <td align="center">New York<br><canvas style="width: 60px; height: 60px;" height="60" width="60" id="c6" class="CoolClock:chunkySwiss:30:noSeconds:-4 leftRightPad"></canvas></td>
      <td align="center">London<br><canvas style="width: 60px; height: 60px;" height="60" width="60" id="c7" class="CoolClock::30:noSeconds:+1 leftRightPad"></canvas></td>
      <td align="center">Townsville<br><canvas style="width: 60px; height: 60px;" height="60" width="60" id="c8" class="CoolClock:fancy:30:noSeconds:+10 leftRightPad"></canvas></td>
        </tr></tbody></table>
    </td></tr>
    </tbody></table>
    Step 3: must download files below
    Files
    coolclock.js
    excanvas.js
    moreskins.js






    JavaScript Vertical Marquee - JavaScript DHTML analog clock - JavaScript Backwards Text​