1.html

<div id='myAlert' style="background: #000; font-size: 2rem; color: #fff; padding: 2rem; display:none; line-height: 2.5rem">
  
    <a href="#" style="float: right; color: #fff; text-decoration: none" onclick="hideAlert()">&times;</a>

    We'll be offline at 9:00PM Central June 22 for database maintance. It should take 60 minutes at most.

</div>

<script>

    var alertVersion = '06212018.r7';

    function hideAlert(){
        var child = document.getElementById("myAlert");
        child.parentNode.removeChild(child);
        document.cookie = "sawNotice=" + alertVersion + ";path=/;expires=Fri, 31 Dec 9999 23:59:59 GMT";
    }
      
    if (document.cookie.split(';').filter(function(item) {
        return item.indexOf("sawNotice=" + alertVersion) >= 0;
    }).length == 0) {
        document.getElementById("myAlert").style.display = "block";
    }
</script>

2.js

var alertVersion = '06212018.r6';

function hideAlert(){
  var child = document.getElementById("myAlert");
  child.parentNode.removeChild(child);
  document.cookie = "sawNotice=" + alertVersion + ";path=/;expires=Fri, 31 Dec 9999 23:59:59 GMT";
}

3.html

<a href="#" style="float: right; color: #fff; text-decoration: none" onclick="hideAlert()">&times;</a>

4.js

if (document.cookie.split(';').filter(function(item) {
  return item.indexOf("sawNotice=" + alertVersion) >= 0;
}).length == 0) {
  document.getElementById("myAlert").style.display = "block";
}