Home > ASP.NET, Javascript > Display the progress bar on page load and postback

Display the progress bar on page load and postback

Just copy the following javascript code on the aspx page.
———————–code————————————–
<script language=”javascript”>
ShowWindowLoading();
//This method will fire before any controls/content is loaded on the client-side
function ShowWindowLoading()
{

try
{
var divLoading = document.getElementById(“divLoadingMsg”);
var fromleft=(alertSize()/2)/2 +50;
if (divLoading == null || divLoading == ‘undefined’)
{

var k=”<table>”;

k +=”<tr>”;
k+=”<td>”;
k +=”<img ID=’LoadingImg’  src=’../images/loading1.gif’ />”;
k +”</td>”;
k +=”</tr>”;
k +=”</table>”;

document.write(“<div id=’divLoadingMsg’ style=’position:absolute; left:”+ fromleft +”px;  background-color:#ececec;’>”+ k + “</div>”);
}
else
{
divLoading.style[“display”] = “”;
}

}
catch (ex)
{

alert(ex);
}
return true;
}
function alertSize() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == ‘number’ ) {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in ‘standards compliant mode’
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
return myWidth;

}
function HideWindowLoading()
{
try
{
document.getElementById(“divLoadingMsg”).style[“display”] = “none”;
}
catch (ex) { }
}

if(window.addEventListener){ // Mozilla, Netscape, Firefox

window.addEventListener(‘load’, HideWindowLoading,false);

} else { // IE
window.attachEvent(‘onload’, HideWindowLoading);
}

</script>

——————————-End——————————————

  1. No comments yet.
  1. No trackbacks yet.

Leave a comment