SplashScreenCover

by Dejan Munjiza

HTML

<div id="cover"></div>
<div class="test">
  <div class="test2">
    <div class="test3">
      <button class="dugme" onclick="mySecondFunction()">Click Me</button>
    </div>
  </div>
</div>


<script>
function mySecondFunction() {
    document.getElementById("cover").style.display = "block";
    }
</script>

CSS

#cover {
  display: none;
  background: black;
  opacity: 0.7;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.test1, .test2, .test3 {
  float: left;
}

.dugme {
  padding: 20px;
  background: gray;
  color: black;
  font-weight: bold;
}