Jquery plug-in for more semantic display of Time-tidytime. js

Date: 2013-8-8 Source: gbin1.com

During website or web application development, it is inevitable that you will encounter a time point, for example, when posting a message or posting a post, so have you ever used a more semantic approach to display time?

It is displayed at as "am"

It is shown at as "Wake up, am just a moment"

Half past two P.M. is displayed as "coming"

Do you think the time shown above is closer to life? If you handle such a time display, it will be a little troublesome. Is there a ready-made class library more perfect?

The jquery class library we will introduce todayTidytime. jsThis will help you achieve a more user-friendly display of time, you can simply configure and use to generate the above time display mode.

How to Use

Import Class Library:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script type="text/javascript" src="tidyTime.js"></script> 

HTML code:

<span class="tidyTime"></span>

JS Code:

$(document).ready(function ($) {     $('.tidyTime').tidyTime();  });

If you need options, you can handle them as follows:

$('.tidyTime').tidyTime({time: '08:15',before:'It\'s ',after:' and I\'m feeling good!',periodOfDay: true,callback:tidyTimeFunction});

Finally, you can use tidytime. js as the clock, as long as you call setinterval, as shown below:

//Jqueryvar tidyTime = $('.tidyTime');tidyTime.tidyTime({before:'Hey dude! It\'s ',after:' and I\'m feeling good!'});setInterval(function(){tidyTime.tidyTime({before:'Hey dude! It\'s ',after:' and I\'m feeling good!'});},30000);

Of course, this class library does not support internationalization. If you use it in a Chinese environment, you also need to modify the text content of the class library according to Chinese habits. I believe it is not a complicated task. I hope everyone will like this class library!

Address: http://git.aaronlumsden.com/tidytime.js/

Source: jquery plug-in to help display time in a more semantic way-tidytime. js