overlay

#overlay {
     visibility: hidden;
     position: absolute;
     left: 0px;
     top: 0px;
     text-align:center;
     z-index: 1000;
     background-image:url(/images/overlay.gif);
}
 
#overlay div {
     width:300px;
     margin: 100px auto;
     background-color: #fff;
     border:1px solid #000;
     padding:15px;
     text-align:center;
}
 
function toggleDisplay(DomObject) {
 
    if (DomObject.style.visibility) {
    	DomObject.style.visibility = (DomObject.style.visibility == 'visible') ? 'hidden' : 'visible';
    }
    else {
    	DomObject.style.display = (DomObject.style.display == 'block') ? 'none' : 'block';
    }
}
 
function overlay() {
	var DomObject = document.getElementById('overlay');
        setOverlayDim(DomObject);
	toggleDisplay(DomObject);
 
	setTimeout('toggleDisplay(\'overlay\')',5000);
}
 
//set the height and width dimensions for the fullscreen overlay layer
function setOverlayDim(DomObject) {
    var x;
    var y;
 
    // all except Explorer
    if (self.innerHeight) {
    	x = self.innerWidth;
    	y = self.innerHeight;
    }
    // Explorer 6 Strict Mode
    else if (document.documentElement && document.documentElement.clientHeight) {
    	x = document.documentElement.clientWidth;
    	y = document.documentElement.clientHeight;
    }
    // other Explorers
    else if (document.body) {
    	x = document.body.clientWidth;
    	y = document.body.clientHeight;
    }
 
    DomObject.style.width = x.toString() + 'px';
    DomObject.style.height = y.toString() + 'px';
}
 
 
    <div id="overlay" style="visibility:hidden;">
         <div id="overlayContent">
 
              <a href="#" onclick="overlay();" style="color:#000;">Close</a>
 
         </div>
    </div>
 
<input type="button" value="" onclick="overlay();" />