Thursday 27 December 2012

Update Progress Bar over the web page


Get the Progress Bar over the controls of the page,while the processing is going on....

 <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="Updatepanel1">
<ProgressTemplate>
<div id="progressBackgroundFilter">
</div>
<div id="processMessage">
<img alt="Loading" src="../Images/processingbar.gif" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>

Style Sheet:


#progressBackgroundFilter
{position: fixed;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
overflow: hidden;
padding: 0;
margin: 0;
background-color: #000000;
filter: alpha(opacity=70);
opacity: 0.5;
z-index: 1000;
}
 #processMessage
{
position: fixed;
top: 48%;
left: 42%;
z-index: 1001;
background-color: #000;
filter: alpha(opacity=50);
opacity: 0.5;
color:#fff;
font-size: 14px;
font-weight:bold;
width: 0mm;
height: 0mm;
text-align:center;
}

No comments:

Post a Comment