Задать вопрос
@wiwkinles

Как указать стиль для моего всплывающего окна на сайт?

Всем хелло. В общем такая проблема.

Существует сайт. На нём необходимо сделать всплывающее окно по типу " Вам есть 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 ничего не меняется, его даже можно удалить. Стили все подключены.

Сам баннер рабочий и работает как нужно

5b02d1c1ae121382796194.jpeg
  • Вопрос задан
  • 110 просмотров
Подписаться 1 Простой Комментировать
Решения вопроса 1
@AlexRas
Вы просто не все стили украли.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы