I am using a jquery easyslider on a page and also pulling some rss feeds using php.
Pulling the feeds is taking a long time and as a result delaying the load of the easy slider until after the feeds have been pulled in. This can be seen here: http://perksconsulting.com/dev/
I am looking for a way to display a loader image in the space where the easy slider is so the images do not appear stacked vertically for a few seconds while the php is interpreted by the server, but I have never used a loader image and am not sure how I would do that.
I am currently using this script to hide the page contents until everything is loaded, but the one thing it is not hiding is the images from the easy slider:
<SCRIPT TYPE="text/javascript" LANGUAGE="javascript">
function waitPreloadPage() { //DOM
if (document.getElementById){
document.getElementById('prepage').style.visibility='hidden';
}else{
if (document.layers){ //NS4
document.prepage.visibility = 'hidden';
}
else { //IE4
document.all.prepage.style.visibility = 'hidden';
}
}
}
// End -->
</SCRIPT>
Ideally I would like to be able to display a loading image in place of the slider in the middle of the page until everything loads. Could anyone tell me how to do this?
Thank you.