CODEWITHSUNDEEP
javascriptjqueryasp.net
James123
James123

Reputation: 11662

blockui overlay not covering whole page?

I am using blockui for "Wait ... loading" pop up. It is working fine, but has one small issue: the overlay is covering only captured screen, not scroll window. If I scroll right, the width is not fully covered (but height is covered fully).

I have only width has problem.

<script language="javascript" type="text/javascript">
    $(document).ready(function () {
        jQuery('#myAlert').click(function () {
            jQuery.blockUI({ message: '<center> <img src="/_layouts/1033/styles/ajax-loaderbar.gif" alt="Loading.." />
                <br />  <font size="2" face="Arial" >
                <b> Please wait... </b></font></center><br /> 
                <font size="2" face="Arial" ><b>while we load all your information.</b></font>'});
        });
    });
</script>

enter image description here

Upvotes: 3

Views: 2883

Answers (1)

Daggar
Daggar

Reputation: 144

The blocking element should be an immediate child of the BODY tag. It should be nested like this:

<html>
 <!-- etc -->
 <body>
  <div id="domMessage"></div>
  ...

And not this:

<html>
<!-- etc -->
 <body>
  <div id="some-other-div">
   <div id="domMessage"></div>
  </div>
...

Upvotes: 3

Related Questions