EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: eggbert on July 29, 2011, 12:28:08 PM



Title: hide page contents before UI is rendered?
Post by: eggbert on July 29, 2011, 12:28:08 PM
Hi,

I notice that for really complex layouts, when the page first loads before the UI has fully rendered, it's showing the content of the page. Of course since the UI has not fully loaded it looks ugly. 

Is there a way I can hide the content of the page until the UI is fully rendered, so that users will never see the non-UI html?  I have experimented with setting body to display:none and then doing $('body').show();  when the document is ready, but then the UI components are not sized correctly.

Any ideas?


Title: Re: hide page contents before UI is rendered?
Post by: stworthy on July 29, 2011, 06:40:47 PM
Hide body and when all UI has been rendered show body again, the code looks like this:

Code:
<script type="text/javascript">
$.parser.onComplete = function(){
$('body').css('visibility','visible');
};
</script>

<body class="easyui-layout" style="visibility:hidden">
<div region="north" style="height:100px"></div>
<div region="center"></div>
</body>