jQuery Plugin To Create Countdown Timers In Action Buttons - UndoCountdown

File Size: 4.37 KB
Views Total: 5212
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Create Countdown Timers In Action Buttons - UndoCountdown

UndoCountdown is a jQuery plugin which helps you create a basic countdown timer inside your action button.

Features:

  • Click on the button to start the countdown.
  • Click again to cancel during countdown.
  • Execute a callback when the countdown is finished.
  • Useful for action confirmation like deleting an item from your web application.

Basic usage:

1. Load jQuery library and the jQuery UndoCountdown plugin at the end of the html document.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jquery.undoCountdown.js"></script>

2. Call the function on the target action button and set the number of seconds you want to countdown.

$("#button").undoCountdown({
  seconds: 10,
});

3. Execute a callback function when the countdown is completed.

$("#button").undoCountdown({
  seconds: 10,
  onComplete: function() {
    alert("Countdown completed.");
  }
});

4. Replace the text which displays during the countdown.

$("#button").undoCountdown({
  seconds: 10,
  term: 'Are You Sure?', 
  onComplete: function() {
    alert("Countdown completed.");
  }
});

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