page loader splash requires override button

tpeck · 05-07-2007, 01:42 PM

Without wishing to get into a debate about the rights and wrongs of splash pages, I have found a method which works just the way I require except for one thing - it sets a timeout for vanishing instead of allowing the user to hit a button to make it vanish.

The idea is to display a PAGE LOADING graphic and have the large page load in the background.

Code:

<body>
<div id="slowScreenSplash" style="position:absolute;z-index:1;top:0px;left:0px;width:1001px; height:1001px; background-color:#000000">
<script>
showImage();
</script>
</div>

...page stuff to load goes here...

<script>
setTimeout("document.getElementById('slowScreenSplash').style.display = 'none'",10000);
</script>

</body>

The showImage() routine allows for a random image to be displayed and works well. The SetTimeout line displays the graphic for 10 secs.

But what I would really like is to have the option to allow, say, at least 10 secs to elapse before the loader vanishes OR a button to press that overrides this wait.

Does anyone know how this could be achieved?

Thanks

vwphillips · 05-07-2007, 04:49 PM

Code:

<input type="button" name="" value="Clear Splash" onclick="document.getElementById('slowScreenSplash').style.display = 'none'" >