jquery - Is it possible to show Loader (progress bar) for one second in a AJax call -

this web page shown in screen shot .

once user logs application clicks on button , shouldn't show him login page , instead show him page he/she has logged after clicking on submit button .

similar gmail functionality google .

i able achive behaviour , how couldn't show progress bar (once clicked on browser button directly showing after logged in page )

html :

<div id="loader" class="loadermain">      <div class="loading_inner"><img src="images/loader.gif"/></div>             </div> 

js :

function submitloginformforbackbutton(email , password) {   var email_input = email ;   var pin_input = password;   var logininfo = {     'email': email_input,     'pin': pin_input   };   var login_information = json.stringify(logininfo);   $.ajax({     type: 'post',     datatype: 'json',     data: login_information,     async: true,     contenttype: "application/json; charset=utf-8",     cache: false,     url: url + '/regents/orn/webchecklogin',     timeout: 7000,         beforesend: function()                     {                         $("#loader").show();                      },                      complete: function()                      {                        $("#loader").hide();                     },     success: function(response) {        ---------       ----------       ----------     }    }); } 

css :

.loadermain{     width: 100%;     height: 101%;     display:none;     background: none;     position: fixed;     z-index: 99999;     top:0px;     transition: 0.2s;     -webkit-transition-duration:0.2s;        -moz-transition-duration:0.2s;          -o-transition-duration:0.2s; }     .loading_inner{     width:60px;     height:60px;     text-align:center;     left:50%;      top:50%;     margin-top:-34px;     margin-left:-32px;     position:absolute;     -webkit-border-radius: 5px;     -moz-border-radius: 5px;     -ms-border-radius: 5px;     -o-border-radius: 5px;     border-radius: 3px;     z-index:999999999; }  .loading_inner img{     width:32px;     margin-top:13px; }