jQuery Date Time Formatting Plugin jTimer - Download Customizable jQuery Date/Time Formatting Plugin - jTimer

Download Customizable jQuery Date/Time Formatting Plugin – jTimer

By Posted on

This time I will share jQuery Plugin and tutorial about Customizable jQuery Date/Time Formatting Plugin – jTimer, hope it will help you in programming stack.

jQuery Date Time Formatting Plugin jTimer - Download Customizable jQuery Date/Time Formatting Plugin - jTimer

File Size: 13.6 KB
Views Total: 911
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Demo Download

jTimer is a customizable, high-performance jQuery date/time formatting plugin that formats dates & times and translates them between other languages.

How to use it:

1. Include the minified version of the jTimer plugin after jQuery library.

view source
1 <script src="//code.jquery.com/jquery.min.js"></script>
2 <script src="jtimer.min.js"></script>

2. The basic usage. DOM is a variable contain the selection of element with jQuery $()

view source
01 // Default langage is ARABIC
02 dom.jTimer();   ==> الأحد 24 سبتمبر 2017   
03 dom.jTimer({ format:"%hh:%mm:%ss" });   ==> 08:56:54
04 dom.jTimer({ format:"%d/%m/%y" });   ==> 24/09/2017
05 dom.jTimer({ format:"%hh:%mm:%ss %D %d %M %y" });   ==> 08:56:54 الأحد 24 سبتمبر 2017
06  
07 // English
08 dom.jTimer({ format:"%D %d %M %y %hh:%mm:%ss", lang:"en" });   ==> Sunday 24 September 2017 08:56:54
09 dom.jTimer({ format:"%DD %d %MM %y %hh:%mm:%ss", lang:"en" });   ==> Sun 24 Sep 2017 08:56:54
10  
11 // Use AM/PM
12 dom.jTimer({ format:"%D %d %M %y %hh:%mm", lang:"en" , ampm:true });   ==> Sunday 24 September 2017 8:56 AM
13 dom.jTimer({ format:"%DD %d %MM %y %hh:%mm:%ss", lang:"en", ampm:true });   ==> Sun 24 Sep 2017 8:57:24 AM

3. Customize the date output.

view source
01 dom.jTimer({
02 format:"%D %d %M %y %hh:%mm",
03 change:true,
04 monthArray: ["month1", "month2", "month3", "month4", "month5", "month6", "month7", "month8", "month9", "month10", "month11", "month12"],
05 dayArray: ["day1", "day2", "day3", "day4", "day5", "day6", "day7"]
06 });   ==>   day1 24 month9 2017 08:58:31
07  
08 dom.jTimer({// we can specify the long od short day and week by shift propertie
09     format: "%DD %d %MM %y %hh:%mm:%ss",
10     change: true,
11     monthArray: ["month1", "month2", "month3", "month4", "month5", "month6", "month7", "month8", "month9", "month10", "month11", "month12"],
12     dayArray: ["day1", "day2", "day3", "day4", "day5", "day6", "day7"],
13     shift:3
14 });    ==>  day 24 mon 2017 08:58:38

4. All default options for the plugin.

view source
01 {
02  
03   // custom format
04   format: "%D %d %M %y",
05  
06   /*
07     AR ==> Arabic
08     AR-GR ==> Arabic Gregorian
09     AR-MG ==> Arabic Maghrebic
10     EN ==> English
11     FR ==> Francais
12     AZ ==> Azérie
13     DE ==> Deutch
14     IT ==> Italien
15     AF ==> African
16     ES ==> Espagnol
17     ID ==> Indonesian
18     PT ==> Portuguese
19   */
20   lang: "AR",
21  
22   // use AM/PM
23   ampm: false,
24  
25   // enable/disable date customization
26   change: false,
27  
28   // an array of custom month names
29   monthArray: [],
30  
31   // an array of custom day names
32   dayArray: [],
33  
34   // shift: 3 = sunday ==> sun, january ==> jan
35   shift: 0
36    
37 }

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

source : jqueryscript.net

Related posts: