Home / Premium Pro Plugins / Smart Timer and Counter

Smart Timer and Counter

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)


Good Timer And Counter is a jQuery plugin that can be utilized so as to add timers and clocks to the net web page. Plugin is very configurable and expandable via customized skins (visible element), modes (clock/timer logic) and languages (translate labels).

Support Forums Follow on Twitter Follow on Envato Subscribe to Newsletter

All styling is finished utilizing CSS (and Canvas for Round pores and skin), and all included kinds are pure CSS with no pictures used. Controls are , makes use of media queries to vary counter sizes, and it may possibly break into a number of traces on smaller screens.

Plugin is examined with present Android (with four.four, 5.1 and 6.zero) browsers, iPhone and iPad Safari and Chrome (with iOS 7, eight, 9), all trendy desktop browsers (IE8 and IE9 won’t present a few of the styling). It requires JavaScript and jQuery help to work.

Clock and Counter Modes, Customized Layouts

Plugin can work as clock or as counter. If used as clock, you may present present date/time, or you can begin from any date. Counter can countdown to any date, countdown any variety of seconds or countup to any seconds restrict. Plugin can show totally different mixture of time and date components, dividers and labels.

Listing of Modes Controls
  • Format: mix order for ‘years, ‘months’, ‘days’, ‘hours’, ‘minutes’, ‘seconds’.
  • Dividers: a number of dividers out there to separate date / time components.
  • Variety of Digits: customise variety of digits for every date / time factor.
Listing of Counter Strategies
  • Date: it have to be sooner or later set utilizing JavaScript Information object. Plugin will depend to zero to succeed in set date.
  • Elapsed: it have to be previously set utilizing JavaScript Information object. Plugin counts how a lot time has elapsed since previous date.
  • Seconds: depend to zero from specified variety of seconds.
  • Goal: depend from zero to specified variety of seconds.

Numbers based mostly depend up and down module

Plugin may also use quantity based mostly format to depend up or down with nice flexibility. It permits for customized variety of digits, decimal locations, decimal and thousand separators, customized step (even randomized from set vary). You possibly can specify one character earlier than and after the counter (like forex signal).

All included skins (excluding Round) work with the numbers module. Some skins can have a bit totally different settings.

7 Skins for show: Base, Easy, Animated, Round, Customized, Plain and Inline

7 Skins for display: Base, Simple, Animated, Circular, Custom, Plain and Inline
Plugin has 7 inbuilt skins to show clocks/counters. Easy and Animated skins have 14 kinds every (some the identical). Animated pores and skin makes use of animations (SlideIn, SlideOut, Fade, FadeIn, FadeOut) to vary digits. Inline pores and skin can be utilized on SPAN tags for including counters inline with textual content with minimal styling modifications.

Listing of Accessible Skins
  • Easy: easy means of displaying digits, with 14 predefined kinds.
  • Animated: animation to vary digits, with 14 predefined kinds and 5 animations.
  • Inline: for components contained in the textual content, with 6 predefined kinds.
  • Round: makes use of Canvas to render round dials, limitless coloration customizations.
  • Customized: prolonged from Animated Pores and skin, free management over colours and styling.
  • Plain: less complicated pores and skin with free management over colours and a few management for stylings.
  • Base: bonus pores and skin with no styling included, with similar habits as Easy pores and skin.

Customized Pores and skin permits free customization

Custom Skin allows free customization
To make use of this pores and skin, Animated pores and skin additionally must be loaded. This pores and skin has no predefined skins. However, you may set customized colours, background, shadows, results from plugin settings. This permits you simple customization of colours and kinds. Additionally, you may change colours independently for each counter factor.

Plain Pores and skin permits simple customization

Plain Skin allows easy customization
That is quite simple pores and skin that enables customization of colours, font and different components.

Round Pores and skin makes use of Canvas to indicate round dials

Circualar Skin uses Canvas to show circular dials
Based mostly on third social gathering jQuery Knob library, permits full customization of dimension and colours (even utilizing transparency) for quantity dials.

Simple customization and integration with detailed documentation

Easy customization and integration with detailed documentation
Plugin has big selection of settings for skins, modes, language. It’s simple to customise and use with any jQuery based mostly undertaking. Documentation incorporates detailed clarification of all settings, record of values, record of kinds and extra. Plugin package deal has loads of demos.

Many occasions and strategies out there for further management

Many events and methods available for extra control
Many occasions out there to connect your personal code to manage issues outdoors of the timers (progress bar, occasions on the web page) with strategies to get present state of the counts or clocks, cease or begin timers and extra. Instance within the package deal reveals easy methods to management progress bar for countdown.

Different plugin options

  • Assist for translation utilizing language objects to vary factor labels.
  • Connect your personal code on callback occasions to deal with begin, cease, end…
  • Many settings to manage counters show: dividers, spacing, labels…
  • Contains strategies to begin, cease, reset or modify counter object components.
  • Contains four PDF information documentation with details about the plugin.

System Necessities

  • jQuery 1.7 or newer
  • Works with jQuery 2.x and three.x


Plugin incorporates PDF person and builders guides contained in the plugin package deal, within the ‘docs’ listing. Take a look at this paperwork to get data on plugin choices, utilization and extra. To begin with the plugin, open the ‘index.html’ file within the browser to get the details about plugin utilization, and record of demos to get you began with the plugin utilization. It’s also possible to discover every instance within the ‘demo’ listing.

Accessible Addons

Flip Skin Addon

  • Content material: Pores and skin with lifelike CSS powered digit flip impact.
  • Hyperlink: On CodeCanyon
  • Value: $eight.00

LED Skins Addon

  • Content material: four Skins based mostly on LED Shows
  • Hyperlink: On CodeCanyon
  • Value: $eight.00

Flat Skins Addon

  • Content material: eight Skins based mostly on squres and circles
  • Hyperlink: On CodeCanyon
  • Value: $eight.00


Model three.three / 2016.10.07.

  • Up to date: Works with jQuery three, examined with jQuery three.1.1
  • Up to date: Some small updates to plugin demos
  • Up to date: PDF Documentation

Model three.2 / 2016.06.01.

  • Up to date: Third social gathering library up to date jQuery Knob 1.2.12
  • Up to date: Default jQuery loaded by demos is now 1.12.four
  • Up to date: Works with jQuery three, examined with jQuery three.zero.zero RC1
  • Up to date: Works with jQuery 2, examined with jQuery 2.2.four
Plugin Website Plugin Changelog Video On YouTube Ask any Question


Check Also


Double Colors

DOWNLOAD It’s countless recreation. You want faucet for rotate blocks. Contact similar colours! Watch video ...


Love Calculator

DOWNLOAD Love calculator is a enjoyable software the place buddies and can calculate the share ...