Download the jQuery timer plugin and put it in a SCRIPT tag in your HTML page after jQuery itself.
+
+
Start a timer:
+
+
$('#divId').timer(); //Same as $('#divId').timer('start')
+
+
Start at a particular time:
+
+
$('#divId').timer({
+ seconds: 100 //Specify start time in seconds
+});
+
+
Pause:
+
+
$('#divId').timer('pause');
+
+
Resume:
+
+
$('#divId').timer('resume');
+
+
Remove Timer:
+
+
$('#divId').timer('remove');
+
+
Get number of seconds:
+
+
$('#divId').data('seconds');
+
+
Get notified:
+
+
+//start a timer & execute a function in 5 minutes & 30 seconds
+$('#divId').timer({
+ duration: '5m30s',
+ callback: function() {
+ alert('Time up!');
+ }
+});
+
+
+
Get notified repeatedly:
+
+
+//start a timer & execute a function every 2 minutes
+$('#divId').timer({
+ duration: '2m',
+ callback: function() {
+ alert('Why, Hello there');
+ },
+ repeat: true //repeatedly calls the callback you specify
+});
+
+
+
Repeat callback & reset timer:
+
+
+//start a timer & execute a function every 30 seconds and then reset the timer at the end of 30 seconds.
+$('#divId').timer({
+ duration: '30s',
+ callback: function() {
+ console.log('Timer will reset!');
+ $('#divId').timer('reset');
+ },
+ repeat: true //repeatedly call the callback
+});
+
+
+
+ Format:
+ By default the timer will display a pretty output (30 sec OR 1:06). You can change this format if you like.
+
+
+
// Show a digital timer instead of pretty timer:
+$('#divId').timer({
+ format: '%H:%M:%S' Display time as 00:00:00
+});
+
+// OR
+$('#divId').timer({
+ format: '%h:%m:%s' Display time as 0:0:0
+});
+
+// OR
+$('#divId').timer({
+ format: '%M minutes %s seconds' Display time as 3 minutes 45 seconds
+});
+
+
+
Update frequency: By default the timer display updates every 500ms to show an accurate update of time. You can change this by specifying the update frequency in milliseconds.
+
+
$('#divId').timer({
+ updateFrequency: 2000 // Update the timer display every 2 seconds.
+});