Block UI until a page has fully loaded : jquery, blockUI plugin

Question

How can I block the UI when the page is still loading using jquery and blockUI plugin? If the page was being loaded using an AJAX call I know the workaround, but when the page is loading with a postback, then how to block the ui until the page has finished loading completely?

Please help. Many thanks in advance for your effort and time.

Answer 1

You'll need to fire the blockUI plugin as soon as the body tag is output.

Instead of the traditional:

<script type="text/javascript">
  $(function (){
    $("body").blockUI(options);
  });
</script>

You'll need to forget about the enclosing $(function (){}) or $(document).ready(function (){}) so your script fires immediately:

<script type="text/javascript">
  $("body").blockUI(options);
</script>