Click here to Skip to main content
15,896,912 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
I googled about how to lock content page while page post back and got the following code,

JavaScript
function showLoading() {
    var windowWidth = 0;
    var windowHeight = 0;

    if ((document.documentElement) && (document.documentElement.clientWidth))
        windowWidth = document.documentElement.clientWidth;
    else if ((document.body) && (document.body.clientWidth))
        windowWidth = document.body.clientWidth;
    else if ((document.body) && (document.body.offsetWidth))
        windowWidth = document.body.offsetWidth;
    else if (window.innerWidth)
        windowWidth = window.innerWidth - 18;

    if ((document.documentElement) && (document.documentElement.clientHeight))
        windowHeight = document.documentElement.clientHeight;
    else if ((document.body) && (document.body.clientHeight))
        windowHeight = document.body.clientHeight;
    else if ((document.body) && (document.body.offsetHeight))
        windowHeight = document.body.offsetHeight;
    else if (window.innerHeight)
        windowHeight = window.innerHeight - 18



    document.getElementById('blackOut').style.display = 'block';
    var height = windowHeight + "px";
    alert(windowHeight + " " + windowWidth);
    document.getElementById('blackOut').style.height = height;
    document.getElementById('blackOut').style.width = windowWidth + "px";
}

------------------------------------------------------------------------------------------------
and my html "blackout" is as follow
------------------------------------------------------------------------------------------------

HTML
<div id="blackOut" style="display: none; position: absolute; background-color: black;
        filter: alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7; z-index: 999; top: 0px;
        left: 0px; height: 1%; width: 1%; height: 1%;">
        <table width="100%" height="100%">
            <tr>
                <td align="center" valign="middle">
                    <h2 style="color: White; font-weight: bold">
                        Please wait...</h2>
                    <br />
                    <img src="/images/progress2.gif" />
                </td>
            </tr>
        </table>
    </div>




but the problem is than it do not lock the entire page.
can you please help me to lock entire page while post back.
Posted
Updated 31-Mar-13 21:08pm
v2
Comments
manognya kota 1-Apr-13 4:42am    
Try changing the width and height of in showloading function
Kalpesh Bhadra 1-Apr-13 5:35am    
i dont want to set it manually, bcos page height is not fixed. although i tried to set it as 100% but it didn't locked the entire page.
manognya kota 1-Apr-13 5:40am    
Can you tell me where have to set it as 100% and also, currently what portion of the screen is being locked?
Kalpesh Bhadra 1-Apr-13 6:18am    
i set style="height:100%" of div id="blackOut" and it works but when i scroll down the remaining page remains same

1 solution

 
Share this answer
 
Comments
Kalpesh Bhadra 2-Apr-13 3:24am    
thank you vijay it worked. thanks a ton

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900