How to pause website from visitors for sometime

Why should I use it ?

• When you are updating your website
• When you are getting fake ads click
• When you are working on templates coding section
  

CSS Code: Just copy and paste in your website template css section

<style>
html {
  pointer-events: none;
}
    .move-area{/*normally use body*/
      width: 100vw;
      height: 100vh;
      padding: 10% 45%;
    }
    .con1{
      width: 100%;
    }
    .eye {
      position: relative;
      display: inline-block;
      border-radius: 50%;
      height: 30px;
      width: 30px;
      background: #CCC;
    }
    .eye:after { /*pupil*/
      position: absolute;
      bottom: 17px;
      right: 10px;
      width: 10px;
      height: 10px;
      background: #000;
      border-radius: 50%;
      content: " ";
    }
    </style>

Script Code: Just copy and paste in your website template script section

   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>
    $(document).mousemove(function(event) {
  var eye = $(".eye");
  var x = (eye.offset().left) + (eye.width() / 2);
  var y = (eye.offset().top) + (eye.height() / 2);
  var rad = Math.atan2(event.pageX - x, event.pageY - y);
  var rot = (rad * (180 / Math.PI) * -1) + 180;
  eye.css({
    '-webkit-transform': 'rotate(' + rot + 'deg)',
    '-moz-transform': 'rotate(' + rot + 'deg)',
    '-ms-transform': 'rotate(' + rot + 'deg)',
    'transform': 'rotate(' + rot + 'deg)'
  });
});
    </script>

HTML Code: Go to blogger Layout section and create a new widget HTML section and paste into it.

<div style="background: #3939396e;height: 100%;position: fixed;top: 0;width: 100%;left: 0;z-index: 999999999;text-align: center;color: red;">
<div style="background:#ffffff9c;margin-top: 250px;">
Site under updating process - <br />
***Please wait while uploading***

  <div class='con1'>
    <div class='eye'></div>
    <div class='eye'></div>
</div>

</div>
</div>

Live Preview