jQueryで時間をカウントダウンするJavaScript「jCountr」

ティザーサイトなどで、あと何秒でオープンみたいな表示があります。
JqueryプラグインjCountrを使用すると似たようなカウントダウンが可能になります。

使用方法

jCountrからjquery.jCountr.jsをjQueryからjquery.jsをダウンロードします。


<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.jCountr.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$("#id名").counter({
		hour:"1",	//開始時間
		min:"02",	//開始分
		sec:"15"	//開始秒
	});
});
</script>

最後に上記で指定したid名を表示させたい場所に記述します。


<span id="id名"></span>

そのほかにもオプションが以下のサンプルのようなものもあり、カウントアップも可能です。

サンプル

interval:"2" //何秒ごとに減らすか
iteration:"2" //一回減らすごとに数値を何個減らすか

direction:"up" //カウントアップ」
min_end:"03" //終了分
Javascriptサンプルページ一覧

skuare.net