Question

I want to display a loading animation while my page is loading, and when loading is complete then obviously hide it.

I am working in ASP.NET using Masterpages, just wondering there is a a simple way of doing this using JQuery?

Any pointers would be appreciated.

Thanks

Answer 1

Just place an image with the animated gif on the page. Give it an id of loadingImage and add the following script:

$(document).ready(function(){
    $('#loadingImage').hide();
});

Incidentally, how long is your page taking to load? Is it using AJAX calls to load data? Maybe you should look into this and in the callback handler, call the hide() function on your image.