Creating A Local Time Clock Using jQuery and Canvas - canvasClock

An easy and fast jQuery plugin used to create a local time clock using Html5 canvas elements.

How to use it:

1. Create a clock container with data-bg-img-url attribute to set the background image of the clock. 

<div class="demo" data-bg-img-url="clock-face20.png"></div>

2. Load the jQuery javascript and jQuery canvasClock plugin at the bottom of your page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.canvasClock.js"></script>

3. Call the plugin on the clock container.

<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.canvas-clock').canvasClock({
brandName: 'jQueryScript'
});
});
</script>

4. Settings.

<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.canvas-clock').canvasClock({
brandName: 'jQueryScript',
showSecondHand: true,
showMinuteHand: true,
showHourHand: true
});
});
</script>

---

This awesome jQuery plugin is developed by harish86. For more Advanced Usages, please check the demo page or visit the official website.