...
var currDate = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
console.log(currDate)
clearTimeout(timer);
var message="Welcome";
switch (currDate)
{
case "2020-2-29":
case "2020-3-1":
case "2020-3-2":
case "2020-3-3":
case "2020-3-4":
case "2020-3-5":
case "2020-3-6":
...
switch (price)
{
case "Research":
message="Print off your local .";
break;
case "Results":
message="Set a challenge;
....
alert (message);
function closeAlertBox(){
alertBox = document.getElementById("alertBox");
alertClose = document.getElementById("alertClose");
alertBox.parentNode.removeChild(alertBox);
alertClose.parentNode.removeChild(alertClose)
alertBox.style.visibility = "hidden";
alertClose.style.visibility = "hidden";
}
window.alert = function(msg){
var id = "alertBox", alertBox, closeId = "alertClose", alertClose;
alertBox = document.createElement("div");
document.body.appendChild(alertBox);
alertBox.id = id;
alertBox.innerHTML = msg;
alertClose = document.createElement("div");
alertClose.id = closeId;
document.body.appendChild(alertClose);
alertClose.innerHTML = "x";
alertBox.appendChild(alertClose);
alertBox.style.visibility = "visible";
/*alertClose.style.visibility = "visible";
I want the alert to disappear if user presses spin. Therefore, this close must be invisible.
If user closes alert by clicking on x, there will be an error message as the spin button will be trying to
close a box that has already been closed.
*/alertClose.style.visibility = "hidden";
alertClose.onclick = closeAlertBox;
};
so replace:
.modal-content {
position: relative;
background-color: #fefefe;
margin: auto;
padding: 0;
border: 1px solid #888;
width: 80%;
by :
.modal-content {
position: relative;
background-color: #fefefe;
margin: auto;
padding: 0;
border: 1px solid #888;
width: fit-content;