У меня есть DIV, который отображается при загрузке страницы.
Его можно закрыть с помощью кнопки или щелкнув в любом месте окна (как в обычном режиме).
Мне нужно, чтобы этот DIV показывался только один раз за сеанс. В данный момент он отображается каждый раз, когда на сайт загружается новая страница. Есть ли простое решение?
Я бы хотел продолжить использовать JQuery show / hide, чтобы сделать это согласно моей рабочей версии ниже. Любая помощь с благодарностью.
HTML
<div id="promoModal" class="promomodal">
<div class="promo-modal-content">
<span class="promo-close">×</span>
CONTENT
</div>
</div>
CSS
.promomodal {
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgb(0, 0, 0);
background-color: rgba(0, 0, 0, 0.7);
padding: 10px;
}
.promo-modal-content {
background-color: #071177;
margin: 15% auto;
padding: 10px;
max-width: 500px;
text-align: center;
}
.promo-close {
color: #fff;
float: right;
top: 0;
font-size: 28px;
font-weight: bold;
}
</style>
JS
var modal = document.getElementById("promoModal");
var span = document.getElementsByClassName("promo-close")[0];
jQuery(document).ready(function ($) {
$('.promomodal').show();
span.onclick = function () {
jQuery('.promomodal').hide();
}
window.onclick = function (event) {
if (event.target == modal) {
jQuery('.promomodal').hide();
}
}
});
</script>