michael-lynch / character-countdown Goto Github PK

#Character Countdown

A simple, lightweight jQuery plugin to display a countdown of the remaining characters eligible in a textarea.

See a demo

##Instructions

Include jQuery and the plugin in the head or footer of your page.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="/js/plugins/characterCountdown.js"></script>

Create a textarea and a sibling element with the class of "countdown."

<textarea></textarea>

<div class="countdown"></div>

Initialize the plugin targeting the class or ID of the textarea or the textarea itself.

$('textarea').characterCountdown();

When the countdown has reached it's limit, the class "max" will be added to the countdown element so you can style the countdown any way you'd like.

<div class="countdown max"></div>

####Options

1. countdownTarget: "id / class / element"
   A string that defines the class, ID or element that will display the countdown (default: '.countdown').
2. maxChars: value
   An integer that defines the maximum amount of characters (default: 140).

#####Example

$(function() {

	$('textarea').characterCountdown({
		countdownTarget: '.my-countdown',
		maxChars: 300
	});

});