<style type="text/css">
#overlay {
  position:absolute; /* กำหนดตำแหน่งให้เ ต็มจอภาพ */
  margin:auto;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:9998;

  background-color:black; /* สีพื้นของ overlay */
  
  filter:alpha(opacity="70"); /* กำหนดความโปร่งใสของ overlay (0-100) */
  MozOpacity:0.7; /* กำหนดความโปร่งใสของ overlay (0-1) cross browser */
  KhtmlOpacity:0.7;
  opacity:0.7;
  
  visibility:hidden; /* ซ่อนไว้ก่อน เพื่อให้เรียกใช้จาก Javascript */
}
</style>
<div id="overlay" onclick="this.style.visibility='hidden'"></div>
<input type="button" onclick="showOverlay()" value="แสดง Overlay" />
<script type="text/javascript" language="Javascript">
function showOverlay() {
  var body = document.getElementsByTagName('body')[0]
  var overlay = document.getElementById('overlay')
  overlay.style.height=body.offsetHeight+"px"
  overlay.style.width=body.offsetWidth+"px"
  overlay.style.visibility="visible"
}
</script>