時間を電光掲示板風に表示するjQueryプラグイン「jQuery uLED plugin」

カウントダウンや現在の時刻を表示することがあるかもしれません。
そんな時はjQuery uLED pluginを利用すると綺麗にかつ簡単に表現する事ができます。

sponsors

使用方法

jQuery uLED pluginからファイル一式をダウンロード。

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="raphael.js"></script>
<script type="text/javascript" src="jquery.uled.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	var l1 = new uLED({
		id : "led", //表示する要素のid名
		type : "countdown", //カウントダウンか時間表示か(countdown,time)
		format : "hh:mm:ss", //表示フォーマット
		color : "#fa0", //文字色
		bgcolor : "#222", //背景色
		size : 12, //文字サイズ
		rounded : 1 //数字の丸み
	});
});
</script>
あとは表示したい場所に下記を書けば完成です。

<div id="led"></div>

サンプル

▼カウントダウン


▼時間表示

Javascriptサンプルページ一覧
skuare.net

sponsors