Есть блок:
<div class="new-design">
<p>Перейти на <a href="">новый дизайн</a></p>
<span class="close-new-design">x</span>
</div>
Логика такова, этот блок статично на странице, но его можно закрыть:
$(document).ready(function() {
$(".close-new-design").on("click", function(){
$(".new-design").addClass('active');
});
});
При закрытии блока, нужно добавить его в localstorage на 1 час, чтобы после часа блок снова вылез на странице.
Проще всего решить эту задачу, используя куки, потому что у кук есть время жизни, и проверять нужно лишь то, существует кука или нет.
(чтобы этот код заработал, нужно нагуглить и скачать плагин jquery.cookie.js)
let cook = $.cookie('cookie_name'); // пытаемся получить куку
if(!cook) { // если куки нет
$('.new-design').css('display', 'block'); // открываем блок
}
else { // а если кука ещё живая, оставляем блок скрытым
$('.new-design').css('display', 'none');
}
$(".close-new-design").on("click", function(){ // по клику
$(".new-design").addClass('active'); // скрываем блок
$.cookie('cookie_name', 'cookie_value', { // ставим куку
expires: 1/24 // на час
});
});
Можно решить и с помощью localStorage, но потребуются дополнительные манипуляции с отсчётом времени, прошедшего с момента клика:
let storage = localStorage.getItem('my_storage'); // получаем значение из хранилища
let now = Math.round(new Date().getTime() / 1000); // получаем текущее время в timestamp
if(storage < now) { // если время в хранилище меньше, чем текущее
$('.new-design').css('display', 'block'); // открываем блок
}
else { // если пока ещё больше (т.е. час не прошёл)
$('.new-design').css('display', 'none'); // оставляем блок скрытым
}
$(".close-new-design").on("click", function(){ // по клику
$(".new-design").addClass('active'); // скрываем блок
localStorage.setItem('my_storage', Math.round(new Date().getTime() / 1000) + 3600); // записываем в хранилище значение, равное текущему времени + 1 час
});
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
Пишу приложение, которое управляет некоторым устройством по com-портуИнформационный обмен осуществляется по принципу запрос-ответ, но устройство...
Есть много кнопок с одинаковым стилем, в которых изменяется только иконка и название и toolTipКак создать универсальный стиль для них?
Пробовал вернуть HBITMAP из unmanaged dll на c++, но его C# не хочет переваривать, описал его как возвращаемый IntPtr, пишет о невозможности преобразования...