human readable elapsed time - Free Download Human-readable Elapsed Time - jQuery timeElapsed.js

Free Download Human-readable Elapsed Time – jQuery timeElapsed.js

Posted on

This time I will share jQuery Plugin and tutorial about Human-readable Elapsed Time – jQuery timeElapsed.js, hope it will help you in programming stack.

human readable elapsed time - Free Download Human-readable Elapsed Time - jQuery timeElapsed.js
File Size: 6.09 KB
Views Total: 1675
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Time Elapsed is a fast, lightweight jQuery plugin that compares the difference between two Dates and displays a human-readable string representing the amount of time that passes from the beginning of an event to its end.

Can be used as a relative date/time formatter for publish/update dates that convert timestamps to a user-friendly format (e.g. 2 days ago, 23 hours ago, etc).

How to use it:

1. Insert the minified version fo the Time Elapsed plugin after JQuery.

1 <script src="/path/to/cdn/jquery.slim.min.js"></script>
2 <script src="/path/to/timeElapsed.js"></script>

2. Add a machine-readable date/time to the data-time attribute:

1 <div class="timer" data-time="2019-12-25 00:00:00">
2   2019-12-25 00:00:00
3 </div>

3. Initialize the plugin and specify the current datatime used to calculate the elapsed time.

1 $('.timer').timeElapsed({
2   currentTime: new Date
3 });
4  
5 // => 2 Months

4. Add postfix & prefix to the human-readable date.

1 $('.timer').timeElapsed({
2   currentTime: new Date,
3   postfix:"ago",
4   prefix: 'Publish Date: '
5 });
6  
7 // => Publish Date: 2 Months ago

5. Enable the Full mode.

1 $('.timer').timeElapsed({
2   currentTime: new Date,
3   full: true
4 });
5  
6 // => 2 Months 12 Days 9 Hours 56 Minutes 12 Seconds

6. Determine whether you want to show seconds or Just now.

1 $('.timer').timeElapsed({
2   currentTime: new Date,
3   seconds: false
4 });
5  
6 // 20 seconds ago => Just Now

Changelog:

2020-04-23

  • Update timeElapsed.js

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