У цій темі немає відповідей

[RUS_D]

Содержимое окна может быть самым разным,оно откроется после загрузки страницы после указанного Вами времени.Время открытия окна после загрузки установлено на 2 секунды (var delay_popup = 2000;) в скрипте.Окошко неплохо оформленно свойствами CSS3,без применения дополнительных скриптов что делает его более лёгким при загрузке страницы.В примере содержимого окна используется модифицированные стили,само окно было сделано для информирования пользователей заходящих на сайт с браузера Internet Explorer.

Код

<style>
#parent_popup {
background-color: rgba(0, 0, 0, 0.8);
display: ;
position: fixed;
z-index: 99999;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
#popup {
background: #fff;
/* Размер окна */
width: 520px;
margin: 10% auto;
padding: 5px 20px 13px 20px;
border: 10px solid #ddd;
position: relative;
-webkit-box-shadow: 0px 0px 20px #000;
-moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
#popup h4{
/* Шрифт заголовка */
font:28px Monotype Corsiva, Arial;
font-weight: bold;
text-align: center;
color: #008000;
text-shadow: 0 1px 3px rgba(0,0,0,.3);
}
#popup h5{
/* Шрифт заголовка */
font:24px Monotype Corsiva, Arial;
color: red;
text-align: center;
text-shadow: 0 1px 3px rgba(0,0,0,.3);
}
/* кнопка закрытия */
.close {
background-color: rgba(0, 0, 0, 0.8);
border: 2px solid #ccc;
height: 24px;
line-height: 24px;
position: absolute;
right: -24px;
cursor: pointer;
font-weight: bold;
text-align: center;
text-decoration: ;
color: rgba(255, 255, 255, 0.9);
font-size: 16px;
text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
top: -24px;
width: 24px;
-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>
<div id="parent_popup">
<div id="popup">
<h4>Уважаемый ползователь IE</h4>
<p>Хотите,чтобы наш сайт в Ваших глазах отображался красиво и элегантно?</p>
<p><h5>Тогда не тяните резину !</h5></p>
<p>Срочно установите бесплатный браузер Mozila!<p>
<p style="text-align: center;">
<strong>
<a class="button" href="http://mozilla-russia.org/products/firefox/yandex/">Скачать бесплатно его можно здесь</a>
</strong></p>
<a class="close" title="Закрыть" onclick="document.getElementById('parent_popup').style.display='';">X</a>
</div>
</div>
<script type="text/javascript">
var delay_popup = 2000;
setTimeout("document.getElementById('parent_popup').style.display='block'", delay_popup);
</script>