ajax load

<style type="text/css" >

.wrap-loading{ /*화면 전체를 어둡게 합니다.*/

    position: fixed;

    left:0;

    right:0;

    top:0;

    bottom:0;

    background: rgba(0,0,0,0.2); /*not in ie */

    filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr='#20000000', endColorstr='#20000000');    /* ie */

    

}

    .wrap-loading div{ /*로딩 이미지*/

        position: fixed;

        top:50%;

        left:50%;

        margin-left: -21px;

        margin-top: -21px;

    }

    .display-none{ /*감추기*/

        display:none;

    }

        

</style>

<div class="wrap-loading display-none">

    <div><img src="./images/loading1.gif" /></div>

</div> 

$.ajax({

     type:"POST"

    ,url: "서버주소"

    ,data:"파라미터"

    ,success:function(res){

        (조회성공일 때 처리)

        

    }

    ,beforeSend:function(){

        (이미지 보여주기 처리)

        $('.wrap-loading').removeClass('display-none');

    }

    ,complete:function(){

        (이미지 감추기 처리)

        $('.wrap-loading').addClass('display-none');

 

    }

    ,error:function(e){

        조회 실패일 때 처리

    }

    ,timeout:100000 "응답제한시간 ms"

});

, beforeSend: function () {

              var width = 0;
              var height = 0;
              var left = 0;
              var top = 0;

 

              width = 50;
              height = 50;
              top = ( $(window).height() - height ) / 2 + $(window).scrollTop();
              left = ( $(window).width() - width ) / 2 + $(window).scrollLeft();

 

              if($("#div_ajax_load_image").length != 0) {
                     $("#div_ajax_load_image").css({
                            "top": top+"px",
                            "left": left+"px"
                     });
                     $("#div_ajax_load_image").show();
              }
              else {
                     $('body').append('<div id="div_ajax_load_image" style="position:absolute; top:' + top + 'px; left:' + left + 'px; width:' + width + 'px; height:' + height + 'px; z-index:9999; background:#f0f0f0; filter:alpha(opacity=50); opacity:alpha*0.5; margin:auto; padding:0; "><img src="file://D:\\temp\\ajax_loader.gif" style="width:50px; height:50px;"></div>');
              }

       }

 , complete: function () {

                     $("#div_ajax_load_image").hide();
       }