Блог

Это модальное окно является удивительным экземпляром, потому что его очень легко осуществить на своем сайте, это окно кроссбраузерно, и совместимо со всеми современными браузерами ( с некоторой изящной деградацией, конечно  ) Что это означает для вас, что это быстро, красиво и просто.

Установка: для начала подключим все загруженные файлы:

Code

Следующий код ставим перед /body:

Code

<div id="myModal" class="reveal-modal">
  <h1>Заголовок окна</h1>
  <p>тут любой ваш контент</p>
  <a class="close-reveal-modal">×</a>
</div>

И наконец-то нам нужно установить кнопку, которая будет вызывать модальное окно:

Для первого варианта

Code

<a href="#" data-reveal-id="myModal">Клик на меня и ты увидишь модальное окно <img src="http://s51.ucoz.net/sm/1/smile.gif" border="0" align="absmiddle" alt="smile" /> </a>

Для второго варианта

Code

<a href="#" class="big-link" data-reveal-id="myModal" data-animation="fade">
Клик на меня и ты увидишь модальное окно <img src="http://s51.ucoz.net/sm/1/smile.gif" border="0" align="absmiddle" alt="smile" />
</a>

Для третьего варианта

Code

<a href="#" class="big-link" data-reveal-id="myModal" data-animation="none">
Клик на меня и ты увидишь модальное окно <img src="http://s51.ucoz.net/sm/1/smile.gif" border="0" align="absmiddle" alt="smile" />
</a>