Простое модальное окно с красивым эффектом для uCoz
827материалов
228тем на форуме
3004комментария
6159пользователей

Простое модальное окно с красивым эффектом для uCoz


Не много описания:

Привет! Сегодня мы с Вами поговорим о модульных окнах на jQuery. Представляю Вашему вниманию простое модальное окно с 3 красивыми эффектами. Окно полностью построено на CSS и jQuery, кстати, такое окно используется и у нас на сайте, его Вы можете увидеть при входе на наш портал (синяя кнопка войти сверху с правой стороны).

Установка jQuery окна:

Для начала перед </head> вставляете:
Код
<link rel="stylesheet" href="http://webmaster-ucoz.ru/ucoz/1/css/reveal.css">
<script type="text/javascript" src="http://webmaster-ucoz.ru/ucoz/1/js/reveal.js"></script>

Далее перед </body> вставляете:
Код
<div id="myModal" class="reveal-modal">
<h1>Название окна</h1>
<p>Содержание окна</p>
<a class="close-reveal-modal" style="text-decoration:none;">×</a>
</div>

Для вызова первого окна (как в демонстрации) используйте код:
Код
<a href="javascript://" class="big-link" data-reveal-id="myModal">Название</a>

Для вызова второго окна (как в демонстрации) используйте код:
Код
<a href="javascript://" class="big-link" data-reveal-id="myModal" data-animation="fade">Название</a>

Для вызова третьего окна (как в демонстрации) используйте код:
Код
<a href="javascript://" class="big-link" data-reveal-id="myModal" data-animation="none">Название</a>

Все, установка окончена :-)

ПОСМОТРЕТЬ ДЕМО ЗАКАЗАТЬ УСТАНОВКУ

Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 17.09.2015 в 10:00
Материал просмотрен: 1600 раз
Категория материала: Скрипты для uCoz
К материалу оставлены: 3 комментария

Пожаловаться
Сказать спасибо

3 комментария


71_nik
Николай @71_nik 17.09.2015 11:221
+2
Однозначно нужная вещь! like
Oleg_Sinicin
Мне нравится, когда сайта выкладывают свои скрипты дизайна. Спасибо! like
Roman
Роман Сергеев @Roman 17.09.2015 15:573
+1
Норм. Возьму)
avatar
Вход через социальные сети
Работа в компании uCoz
uSocial - социальные кнопки
uLike – кнопка «Мне нравится»
Статистики нашего сайта