2016年1月16日土曜日

jQuery の ajax 処理で Now Loading の画像を表示する方法

jQuery の ajax 処理で Now Loading の画像を表示する方法
http://jquery.nj-clucker.com/now-loading/

// Loadingイメージ表示関数
function dispLoading(msg){
// 画面表示メッセージ
var dispMsg = "";

// 引数が空の場合は画像のみ
if( msg != "" ){
dispMsg = "<div class='loadingMsg'>" + msg + "</div>";
}
// ローディング画像が表示されていない場合のみ表示
if($("#loading").size() == 0){
$("body").append("<div id='loading'>" + dispMsg + "</div>");
}
}

// Loadingイメージ削除関数
function removeLoading(){
$("#loading").remove();
}
http://jquery.nj-clucker.com/now-loading/


#loading{
border:1px dashed #999;
padding:15px;
position: fixed;
top:50%;
left:50%;
background-color:#FFF;
filter: alpha(opacity=85);
-moz-opacity:0.85;
opacity:0.85;
}

#loading .loadingMsg{
text-align:center;
padding-top:100px;
width:100px;
background-image:url("(LoadingイメージのURL)");
background-position: center top;
background-repeat: no-repeat;
font-family: "メイリオ"!important;
}

0 件のコメント:

コメントを投稿