JavaScript full screen overlay using a div element

<html>

<head>

   <script>
      function showDiv(text, image) {

         var div = document.createElement('div');

         div.addEventListener('click', function(event) {
            div.style.visibility = "hidden";
         }, false);

         window.addEventListener('resize', function(event) {
            if (div.style.visibility == "visible") {
               drawDiv(div, text, image);
            }
         }, false);

         drawDiv(div, text, image);

         document.body.appendChild(div);

      }

      function drawDiv(div, text, image) {

         div.style.left = "0";
         div.style.top = "0";
         div.style.width = "100%";
         div.style.height = "100%";
         div.style.position = "fixed";
         div.style.visibility = "visible";
         div.style.background = "black";
         div.style.opacity = "0.85";
         div.style.color = "white";
         div.innerHTML = "<br><center><img src= 'https://somedomain/somepath/" + image + ".jpg'><br><div style='width:" + (window.innerWidth / 2) + "'>" + text + "</div></center>";

      }
   </script>

</head>

<body>

   <a href="" onClick="showDiv('Some text.', 'imagename'); return false;">Click here</a>

</body>

</html>