Модальные окна по средствам CSS

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем alex_storm, 16 янв 2013.

  1. alex_storm

    alex_storm дизайн, CSS Команда форума

    Регистрация:
    11 дек 2012
    Сообщения:
    1.120
    Симпатии:
    560
    В html размещаем ссылку, при клике на которую, будет открываться модальное окно:

    Код:
    <a href="#win1" class="button green" id="win_pop">Модальное окно</a>
    Указываем скрытый контент, который и будет открываться в модальном окне:

    Код:
      <a href="#x" class="overlay" id="win1"></a>
      <div class="popup">
    	ЗДЕСЬ ВЫ МОЖЕТЕ РАЗМЕСТИТЬ ЛЮБУЮ ИНФОРМАЦИЮ БУДЬ ТО ПРОСТО ТЕКСТ С КАРТИНКАМИ ИЛИ ЖЕ ВИДЕО!
    	<a class="close"title="Закрыть" href="#close"></a>
    	</div>
    И пропишем в таблице стилей, стили для нашего окна:

    Напомню, что данный способ не кроссбраузрный вариант.
     
  2. yoda4

    yoda4

    Регистрация:
    31 дек 2013
    Сообщения:
    11
    Симпатии:
    3
    А под какие браузеры работает? Хотя сейчас сам проверю.