рони,
смотри, тут на странице виден пустой блок, без текста, а как сделать чтобы блок пропал, присвоив ему display: none; а когда будет праздник блоку надо присвоить display: block
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<style>
#holiday {
display: none;
background: hsl(0,0%,90%);
color: hsl(340,100%,50%);
font: bold 24px/20px serif;
text-align: center;
padding: 15px 20px;
border: 1px solid hsl(0,0%,50%);
border-radius: 12px/9px;
}
</style>
</head>
<body>
<div id="header">
<div id="logo"></div>
<div id="block_time-data"></div>
</div>
<div id="holiday">
</div>
<script type="text/javascript">
var holidays = {
'1': {
'1': {'start': 0, 'duration': 24, 'compliments': 'С новым годом !'},
'7': {'start': 0, 'duration': 24, 'compliments': 'С рождеством !'} },
'2': {
'23': {'start': 0, 'duration': 24, 'compliments': 'С 23 февраля !'} },
'3': {
'8': {'start': 0, 'duration': 12, 'compliments': 'С 8 марта !'} },
'4': {
'12': {'start': 0, 'duration': 12, 'compliments': 'С днём космонавтики !'} },
'5': {
'1': {'start': 0, 'duration': 12, 'compliments': 'С 1 мая !'},
'9': {'start': 0, 'duration': 24, 'compliments': 'С 9 мая !'} },
'6': {
'1': {'start': 0, 'duration': 24, 'compliments': 'С 1 июня, Всемирным днём родителей !'} },
'7': {
'3': {'start': 0, 'duration': 24, 'compliments': '3 июля, день независимости Республики Беларусь !'} },
'8': {
'12': {'start': 0, 'duration': 24, 'compliments': '12 августа международный день молодёжи !'} },
'9': {
'1': {'start': 0, 'duration': 24, 'compliments': '1 сентября, день знаний !'} },
'10': {
'1': {'start': 0, 'duration': 24, 'compliments': '1 октября, международный день пожилых людей !'} },
'11': {
'7': {'start': 0, 'duration': 24, 'compliments': '7 ноября, день октябрьской революции !'} },
'12': {
'25': {'start': 0, 'duration': 24, 'compliments': 'С католическим рождеством !'} }
}, d = new Date( "2 May 2021 00:00:00:001" ), m;
if((m = holidays[d.getMonth()+1]) && m[d.getDate()]) {
//можно записывать в сессионное хранилище условие (метку окончания показа)
//и проверяя ее в ней, если она есть, сразу отображаем поздравление и запускаем таймер окончания
//в противном случае запускаем таймер сканирующий время на соответствие началу старта поздравления
//и при этом событии пишем метку окончания в сессию
//конечное сравнение для старта, это
m = m[d.getDate()];
if(d.getHours()>=m.start) {
var b = document.getElementById("holiday");
if (!b) { b = document.createElement("div");
b.id = "holiday"; }
b.innerHTML = m.compliments; document.querySelector("body").appendChild(b);
}
}
</script>
</body>
</html>
|