Pop-up или модальное окно +18.

Простое поп-ап окно предупреждение +18 появляющиеся при загрузке страницы и акцентирующие внимание посетителя на содержании контента. Как установить всплывающие окно и код для установки на страницы сайта.На страницах содержащих недвусмысленный контент по правилам следует устанавливать возрастное предупреждение-ограничение.

Установка pop-up окна.

Хотя это всего лишь формальность,но в некоторых случаях приходиться прибегать к подобным извращениям,чтобы избежать санкций,так и хочется написать Евросоюза.Хотя всплывающие модальное pop-up окно может служить для различных целей: для рекламы продукта,анонса или просто приветствия.

Для того чтобы установить окно для показа предупреждений или анонсов на своём проекте следует скопировать CSS код и вставить в шаблон перед закрывающим тегом ]]></b:skin>.

<style type="text/css">
 #parent_popup {
background-color: rgba(0, 0, 0, 0.9);
display: none;
position: fixed;
z-index: 99999;
top: 0;
right: 0;
bottom: 0;
left: 0;
} #popup  {
background: #fff;
width: 520px;
font-size: 26px;
margin: 10% auto;
padding: 5px 20px 13px 20px;
border: 10px solid #ddd;
position: relative;
 /*--CSS3 Тени для Блока--*/
 -webkit-box-shadow: 0px 0px 20px #000;
 -moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
 /*--CSS3 Скругленные углы--*/
 -webkit-border-radius: 15px;
 -moz-border-radius: 15px;
border-radius: 15px;
} .close {
background-color: rgba(20, 70, 30, 0.8);
border: 2px solid #ccc;
height: 24px;
line-height: 24px;
position: absolute;
right: 15px;
cursor: pointer;
font-weight: bold;
text-align: center;
text-decoration: none;
color: rgba(255, 255, 255, 0.9);
font-size: 14px;
text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
top: 280px;
width: 124px;
 -webkit-border-radius: 15px;
 -moz-border-radius: 15px;
 -ms-border-radius: 15px;
 -o-border-radius: 15px;
border-radius: 15px;
 -moz-box-shadow: 1px 1px 3px #000;
 -webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
}
.close:hover {
background-color: rgba(0, 122, 200, 0.8);
}</style>

Следующий шаг это небольшой JavaScript-код,который надо будет разместить в разделе body вашего шаблона.

<script type="text/javascript"> var delay_popup = 50; setTimeout("document.getElementById('parent_popup').style.display='block'", delay_popup); </script>

Смотреть ещё Слайдер- ротатор для блогаРотатор для баннеровЭффекты для фото на CSS.Как добавить форум на блогОформление блоков для кода

Ну а HTML-код с картинками и текстом можно будет установить в любой гаджет HTML и
JavaScript,или же если требуется показ данного модального окна лишь на определённых
страницах,то прямо в тело сообщения в самом конце,чтобы не мешал.

<div id="parent_popup">
<div id="popup">
<h4>
«Внимание просьба для всех тех кому не исполнилось 18 лет покинуть сайт»</h4>
<div class="separator" style="clear: both; text-align: center;">
<img border="0"
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIi4kid9h_SZtcQwpimw1CeQNmQuctrtVahELVphyphenhyphenBUaFb9WbM_ldOV93RUzlRmiAilOQaSBj9jTQk9LW1bLexvwR8oOEGesl_KDUjWS7oQU0K4bfnt5d1QnsoYWaf5fafSC5M3E40fZkW/s1600/v-gol.ru+popap.png"
height="197" width="320" /></div>
<a class="close"onclick="document.getElementById('parent_popup').style.display='none';"
title="Закрыть">+18   ВХОД</a></div>
</div>