Loading of ASP.NET pages at first looks odd until everything is loaded
I am using ASP.NET 3.5 with JQuery, JS files, CSS files 开发者_JAVA百科and lots of images for my background. For some reason when you first load your page everything is out of wack until you have finished loading everything on the page.
- Why is this?
- How can I fix this problem?
Thanks in advance!
The reason is that CSS styles, scripts and images have not been fully downloaded. The browser shows HTML without styles and this is why you get the weird look. Once everything is downloaded and interpreted, everything suddenly falls into place.
You should somehow reduce the size of your dependencies ideally. Or use faster connection for your server, but the latter can be quite expensive.
There are some things you can do to reduce the download time to minimise this problem.
You can minify your javascripts:
http://www.minifyjs.com/
reduce the amount of resources being downloaded by combining javascripts. You can also combine CSS files if possible.
The ySlow firefox plugin can analyse your site for you and give suggestions on some of the things you can do:
http://developer.yahoo.com/yslow/
You may also want to look at turning on GZIP compression if it is not already:
http://www.microsoft.com/technet/prodtechnol/WindowsServer2003/Library/IIS/25d2170b-09c0-45fd-8da4-898cf9a7d568.mspx?mfr=true
The CSS styles are not being applied soon enough. If you refer to this post on google groups it advises to add the styles manually:
<ul class="ui-tabs-nav"> ... </ul>
<div class="ui-tabs-panel"> ... </div>
One method I have seen before is to embed the main content of the page in a div, which is initially set to be invisible
<div id="mainPageDiv" style="display:none;">
<form id="form1" runat="server">
... Your content here...
</form>
</div>
Then, on the page load event in javascript, you set the main div to be visible.
<body onload="document.getElementById('mainPageDiv').style.display='block';">
I am not sure exactly effective this would be though. One drawback would be the users would be present with a totally white screen for a short-while, possibly leading them to think there was a problem.
加载中,请稍侯......
精彩评论