Всем хелло. В общем такая проблема.
Существует сайт. На нём необходимо сделать всплывающее окно по типу " Вам есть 18 лет? ". Я сделал (украл) и получил такой код:
index.php<link rel="stylesheet" href="css/18plus.css">
<script src="js/18plus.js"></script>
<?php if (!isset($_COOKIE['checkout'])) { ?>
<div id="overlay">
<div id="popup">
<h1>Вам есть 18 лет?</h1>
<button id="popup_ok">Да</button>
<button id="popup_no">Нет</button>
</div>
</div>
<?php } ?>
JavaScript$(document).ready(function(){
$('#popup_ok').click(function(){
$('#overlay').hide();
$('#popup').hide();
$.post("/checkout.php", {check: true}, function(response){
// для теста: console.log(response);
});
});
$('#popup_no').click(function(){
location.href = 'http://yandex.ru';
});
});
PHP (checkout) для записи в куки, чтобы баннер появлялся через определенное время, сейчас стоит минимальное кол-во, чтобы удобнее было редактировать
<?php
if (isset($_POST['check'])) {
setcookie("checkout", md5(microtime(true)), time() + 3, "/");
echo 'Ok';
}
?>
И долгожданный
CSS, который НЕ ВЛИЯЕТ на МОЙ баннер!
#overlay {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.8);
}
#popup {
width: 500px;
height: 300px;
position: fixed;
left: 50%;
top: 50%;
margin: -150px 0 0 -250px;
background: white;
color: black;
border: 2px solid black;
}
Чтобы я не писал в CSS ничего не меняется, его даже можно удалить. Стили все подключены.
Сам баннер рабочий и работает как нужно
