Всплывающее окно при входе на сайт

Вставляем код в позицию баннера

<div id="parent_popup">

<div id="popup">

Тут пишем  ваш текст.

Или вставляем HTML код.

<a class="close"title="Закрыть" onclick="document.getElementById('parent_popup').style.display='none';"></a>

</div>

</div>

<script type="text/javascript">

                var delay_popup = 5000;

                setTimeout("document.getElementById('parent_popup').style.display='block'", delay_popup);

</script>

И добавляем стили CSS - Если нет доступа к CSS то вставляем код вместо троеточия <style type="text/css">   ...  </style> и получившееся вставляем вместе с кодом выше.


#parent_popup {

  background-color: rgba(0, 0, 0, 0.8);

  display: none;

  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;

  /*--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(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: none;

    color: rgba(255, 255, 255, 0.9);

    font-size: 14px;

    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);

}

 

Вы можете прочитать более подробно об этом тут - http://dbmast.ru/sozdaem-vsplyvayushhee-okno-pri-zagruzke-sajta-s-pomoshhyu-css3-i-nemnogo-javascript


04.06.2013
Просмотров (13096)
Яндекс.Метрика
© Copyright 2013 - 2017 Уроки Fo.Ru