Create Analog Clock With jQuery And CSS3 – jsRapClock Plugin

by

Today I am going to share awesome jQuery and CSS3 based jQuery plugin which help you to display an simple and beautiful analog clock on your website. jQuery jsRapClock is a simple, lightweight jQuery clock plugin which makes it easy to render a responsive Analog Clock on the web application using CSS3 2D transforms without canvas and SVG.
analog-clock-jquery


Libraries

Load the plugin’s CSS and JS library with jQuery core library.

HTML

Create a simple DIV container where you want to render the analog clock.



JS

$(function(){
  $('#clock').jsRapClock();
});

Use following option to customize analog clock.

$('#clock').jsRapClock({
	caption:'London',
	shiftH:1,
	shiftM:30
});

See live demo and download source code.

DEMO | DOWNLOAD

This awesome plugin is developed by Thibor. Visit their official github repository for more information and follow for future updates.


Published by Rohit