Preloading an HTML page – How to delay the page load till the Javascript libraries are loaded


Working on an HTML page that loads heavy JavaScript files (jQuery, Pikachoose, Dojo, Prototype, …) may make the page loads being delayed which is a problem to be solved by compressing all JavaScript files before deploying to production environment.

Some JavaScript libraries (like Pikachoose) make you write regular HTML tags which is transformed into special effects/elements when the JavaScript Library continue to load which may result into unhappy results. It may result into corrupted layouts which continue to show till the JavaScript library being loaded by the browser and executed according to its sequence.

Pre-loading the HTML page

The solution of this problem is very straightforward. Just we need to delay the display of the whole page until the browser finishes loading the JavaScript files/resources needed.

This is done by using the following JavaScript code snippet :

<script type="text/javascript">
with ( {

visibility = ‘hidden’;
overflow = ‘hidden’;

oldinwdowonload = window.onload;
window.onload = function() {
visibility = ”;
overflow = ”;
if( oldinwdowonload )

The preceding example is just an JavaScript lines to hide the whole document element until the page load event fire.

Also note that it saves the current onload page event, (in case it was set) to call it later after displaying the document element again.

It worked on the 3 browsers, Firefox 4, IE9 & Chrome.

Have Fun 🙂


1 thought on “Preloading an HTML page – How to delay the page load till the Javascript libraries are loaded

  1. Thanks alot Ahmed, this is very useful informations,especially for picka cotchy choose

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this:
search previous next tag category expand menu location phone mail time cart zoom edit close