Пользователь закрывает баннер и не показывает его в течение следующих 30 дней. ⇐ Html

[Anonymous]

У меня есть сценарий JavaScript, который может скрывать баннеры на определенное время после того, как пользователь взаимодействует с ними, и закрывать их кнопкой X.
Баннер 01 может скрываться на 1 день (24 часа), когда пользователь закрывает этот баннер.
Баннер 02 может скрываться на 30 дней, когда пользователь закрывает этот баннер.
Теперь мой код не работает так, как я хочу, и пользователь не может даже закрыть один из этих баннеров.
Когда я использую часть Javascript, предназначенную для баннера 01, и тестирую ее, баннер 01 работает нормально, после того, как пользователь закроет этот баннер, через 24 часа он будет отображаться снова.
Мне нужна именно эта функциональность для баннера 02, но не на 24 часа, а на 30 дней. Эти два баннера могут работать вместе на одном сайте.
Есть ли какое-либо решение, как использовать эти два баннера с функциональностью каждого из них, о которой я упоминал выше?

Код: Выделить всё

// Banner 01
const header = document.getElementById('mainheader')
const bannercloser = document.getElementById('bannercloser')
const banner = document.getElementById('mainbanner')

function getCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
}
return null;
}

function checkCookie() {
if (getCookie('banner')) {
banner.classList.add('disabled');
header.classList.add('disabled');
} else {
banner.classList.remove('disabled');
header.classList.remove('disabled');
}
}
checkCookie()

bannercloser.addEventListener('click', () => {
setTimeout(function() {
banner.classList.remove('disabled');
header.classList.remove('disabled');
}, 1 * 24 * 60 * 60 * 1000)
var d = new Date();
d.setTime(d.getTime() + (1 * 24 * 60 * 60 * 1000));
var expires = "; expires=" + d.toGMTString();
document.cookie = "banner=1" + expires + "; path=/";
banner.classList.add('disabled');
header.classList.add('disabled');
})

//Banner 02
const cookiesCloser = document.getElementById('cookiesCloser')
const cookiesBanner = document.getElementById('cookiesBanner')

function getCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
}
return null;
}

function checkCookie() {
if (getCookie('banner')) {
cookiesBanner.classList.add('disabled');
} else {
cookiesBanner.classList.remove('disabled');
}
}
checkCookie()

cookiesCloser.addEventListener('click', () => {
setTimeout(function() {
cookiesBanner.classList.remove('disabled');
}, 30 * 24 * 60 * 60 * 1000)
var d = new Date();
d.setTime(d.getTime() + (30 * 24 * 60 * 60 * 1000));
var expires = "; expires=" + d.toGMTString();
document.cookie = "banner=1" + expires + "; path=/";
cookiesBanner.classList.add('disabled');
})

Код: Выделить всё

#cookiesBanner {
background: pink;
}

.announcement-banner {
background: orange;
}

#cookiesBanner.disabled {
display: none;
}

.announcement-banner.disabled {
display: none;
}

Код: Выделить всё

[b]Banner 01[/b]
X



Banner 02
X

Подробнее здесь: https://stackoverflow.com/questions/660 ... xt-30-days