綺麗なローディングを設置できるJavaScript「Percentage Loader」

ローディングというとぐるぐるまわったりするアニメーションgifが多いですが、jQueryプラグインのPercentage Loaderを使用すると綺麗なものを設置できます。
ユーザーストレスを少し軽減できるかもしれません。
※対応ブラウザ:Firefox 3.0+, Safari 4.0+, Chrome 7+, IE9+, Opera 9+

sponsors

使用方法

Better2Web / jquery.percentageloaderからファイル一式をダウンロード。

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.percentageloader-01a.js"></script>
<link rel="stylesheet" href="jquery.percentageloader-01a.css" />
<script>
$(function() {
	$("#id名").percentageLoader({
	    width : 180, //幅
	    height : 180, //高さ
	    progress : 0.23, //進捗度
	    value : '512kb' //数値
    });
});
</script>
あとは表示したい場所にidを付与すれば完成です。
<div id="id"></div>

サンプル


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

sponsors