Красивое окно откроется после загрузки страницы - Скрипты для uCoz | Делай сайт
Приветствую Вас, Гость! Регистрация
Георгиевская ленточка
Среда, 07.12.2016
Скрипты для uCoz » Окна для сайта uCoz » Красивое окно откроется после загрузки страницы

Аудиоплеер для сайта uCozАудиоплеер с плейлистом для сайта
Видеоплеер для сайта uCozВидеоплеер с плейлистом для сайта
Меню для сайта uCozВертикальное меню для сайта uCoz
Выпадающее меню для сайта uCozГоризонтальное меню для сайта uCoz
Круглое меню для сайта uCozВид материалов для сайта uCoz
Вид материалов Аудио для uCozВид материалов Видео для uCoz
Галерея для сайта uCozГенераторы для сайта uCoz
Контейнер для контентаКнопки для сайта uCoz
Слайдер для сайта uCozСчётчик для сайта uCoz
Часы для сайта uCozТекстовые эффекты
Таблица цветов для сайта uCozЭффекты для сайта uCoz
Эффекты курсораЭффекты увеличения
Мини чат для сайта uCozРадио для сайта uCoz
Скрипты для юКозИгры для сайта uCoz
Окна для сайта uCozИнформеры для сайта uCoz
Флеш и анимации для сайтаКалендарь для сайта uCoz
Мониторинг серверов для ucozСлайдшоу для сайта uCoz



Адаптивный сайт - aTmpl



Красивое окно откроется после загрузки страницы

Окно откроется для информирования после загрузки страницы сайта





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





Пример скрипта для установки

<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;
-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: none;
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='none';">X</a>
</div>
</div>
<script type="text/javascript">
var delay_popup = 2000;
setTimeout("document.getElementById('parent_popup').style.display='block'", delay_popup);
</script>


Проверьте работу окна скопировав код примера в редактор









Русские шрифты



Ссылка:
BB code:




  • ©
  • | Просмотров: 2143 | Добавил: IZOTOP | Рейтинг: 0.0/0
    | Теги: после загрузки, открыть окно, перезагрузки страницы

    Всего комментариев: 2
    0   Спам
    2 karel   (20.01.2013 08:58)
    Аватар karel Доброе время суток !
    Спасибо ! yes

    0   Спам
    1 karel   (18.01.2013 08:06)
    Аватар karel Приветствую Вас ! Возможно ли сделать так ,что бы страница сама не затемнялась , а открывалось одно окошко с надписью и так же автоматически закрывалось через (пример ) 2 сек.


    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]