Simle jQuery Timer Controller Plugin - jQuery Timer
File Size: | 3.49KB |
---|---|
Views Total: | 1218 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
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.