Create Simple JQuery Flip Countdown Timer – Flipclock Js
If you are running any deals or auction sites then displaying countdown timer with running deals is great idean that’s why In this post I am going to share a jQuery plugin to create fast countdown timer for your deals/auction/coming soon page. FlipClock is a jQuery plugin for creating a clock/timer/countdown that displays information in a digital format on a split flap display.
Creating Countdown Timer
In below example I am going to create a simple new year coutdown timer with the help of flipclockjs plugin.
Include flipclock.css CSS and flipclock.min.js JS library just after latest jQuery Library
<!--CSS--> <link rel="stylesheet" href="flipclock.css"> <!--JS--> <script src="//code.jquery.com/jquery-latest.min.js"></script> <script src="flipclock.min.js"></script>
Create your countdown clock.
For creating new year countdown get the current date and Set some date in the future. In this case, it’s always Jan 1 and Calculate the difference in seconds between the future and current date and pass diff in FlipClock countdown.
See live demo and download source code.
Visit official github repository for more information and follow for future updates. Don’t forget to read license for using this plugin in your projects.