Simle jQuery Timer Controller Plugin - jQuery Timer

File Size: 3.49KB
Views Total: 1213
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Simle jQuery Timer Controller Plugin - jQuery Timer

Timer is a simple jQuery plugin that allows you to control timer events with callback support.

How to use it:

1. Include the latest jQuery library and jQuery Timer on your html page

<script src="http://code.jquery.com/jquery.js"></script>
<script src="jquery.timer.js"></script>

2. Create buttons to control a timer

<input type="button" name="start" value="Start Example"/>
<input type="button" name="stop" value="Stop Example"/>
<input type="button" name="reset" value="Reset Example"/>
<div id="console"></div>

3. The javascript. By default, the timer will execute every second

<script>
$(function() {
var timeout = 1000;
var timer;

$("input[name=start]").click(function() {
$("#console").append("<span style=\"color: #0F0\">Timer started.</span<br />");
timer = $.timer(timeout, function() {
$("#console").append("Timer completed.<br />");
});
});

$("input[name=stop]").click(function() {
$("#console").append("<span style=\"color: #F00\">Timer stopped.</span<br />");
timer.stop();
});

$("input[name=reset]").click(function() {
timer.stop();
timeout = prompt("Reset timeout too:", 500);
timer.reset(timeout);
$("#console").append("<span style=\"color: #00F\">Timer reset.</span<br />");
});
});
</script>>

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