I am building a interstitial page, using <div> and JavaScript, really simple script but neat.
Everything is working, but I also would like to close the div's after a few seconds (like 10 seconds, for example). Here what I have so far:
- I have two div's, 1 and 2.
- I have the CSS setup for div 1 like: display: none; (div 1 have the content for the splash screen)
- Div 2 is the layer that will cover the page and leave only div 1 visible.
To load the div's I have a onload function like this:
onload="document.getElementById('div1').style.display='block';document.getElementById('div2').style.display='block'"
To hide the divs I have an onclick function like this:
<a href = "javascript:void(0)" onclick = "document.getElementById('div1').style.display='none';document.getElementById('div2').style.display='none'"></a>
How can I execute the onclick function with a timer, and how can I do it? It also has to be in JavaScript.
Change 1000 to the number of milliseconds you want to delay.
I believe you are looking for the setTimeout function.
To make your code a little neater, define a separate function for onclick in a
<script>
block:then call your function from
onclick
setTimeout will help you to execute any JavaScript code based on the time you set.
Syntax
Usage,
For more details, see http://www.w3schools.com/jsref/met_win_settimeout.asp