Ajax preloader for large background image?

JavaScript
1

I have a rather large background image as part of the website layout. It’s basically the header. It takes a while to load.

I wonder if there is an AJAX or javascript loader that can show a loading gif before the image is loaded and then be removed so it doesn’t show when you change pages next time.

The CSS for the header is below

I wonder if anyone knows what code to use for a preloader? Would be grateful for info about this

Thanks!

CSS

#header{
height: 567px;
width:1000px;
margin: 0 auto;
background: url(images/header.png);
background-repeat: no-repeat;
}

HTML

<div id=“header”></div>

2

Here is a nifty loading gif (or anything you want to say) script. However it will show on each page until the page is done loading. So it’s a whole page loading script. Gets you closer at least. I don’t think your going to find what your after anyway. http://www.visibilityinherit.com/code/loading-gif.php