ローダー

サーバとの通信中などに使用できるローダーです。

ローディング中は画面の操作が無効になり、2重ポストを防ぎます。


サンプルでは submit ボタンを押すとローディング中となり、5秒経過した後にメッセージを表示して復帰します。

body の直下に所定のタグを埋め込みます。

<div class="loader"></div>の部分を別のローダーに置き換えることで、様々なローダーを実装することができます。

Script Source
$("#id_submit").on("click", function(){
	var lod = new PRLoader();
	lod.enable(); // ロード開始
	setTimeout(function(){
		lod.disable(); // ロード終了
		alert("ロードが完了しました。");
	}, 5000);
});

PRLoaderクラスをnewして使用します。

enable()がロード開始でdisable()がロード終了です。

HTML
<body>
<div id="prTag_maskAll" class="prSt_maskAll"></div>
<div id="prTag_loader" class="prSt_loader">
 <div class="loader"></div>
</div>

bodyタグ直下に上記のタグを記述します。