Modalbox — создаем диалоговые окна

Modalbox — библиотека на prototype и script.aculo.us для создания диалоговых окон и мастеров, обьем ее кода всего 10кб. На мой взгляд это настоящий атрибут веб два нольности.


Modalbox работает в IE6, IE7, Firefox 1.0, 1.5, 2.0, Safari, Camino, Opera 8 и 9.

Вот так выглядит окно мастера созданного с помощью modalbox:

Установка

1. Скачайте ModalBox и распакуйте его в папку, например в /includes(у вас уже должны быть prototype + script.aculo.us библиотеки, так как они нужны для работы Modalbox.)
2. Подключите все необходимые библиотеки, вставив код указанный ниже между тегами head:
   

   <script type="text/javascript" src="includes/prototype.js"></script>
   <script type="text/javascript" src="includes/scriptaculous.js? ¬
       load=effects"></script>
   <script type="text/javascript" src="includes/modalbox.js"></script>

   
   
3. Подключите CSS файл оформления — «modalbox.css», так же вставив код между тегами head:
   

   <link rel="stylesheet" href="includes/modalbox.css" type="text/css"
   media="screen" />

   
   

Пример использования

<a href="frame_send-link.html" title="Simple form" onclick="
<strong>Modalbox.show(this.href, {title: this.title, width: 600}); return false;</strong>
"> Send link to a friend</a>

Этот пример откроет страницу «frame_send-link.html» как блок Modalbox'а шириной 600px без перезагрузки страницы.

Скачать библиотеку «ModalBox»

Посмотреть еще кучу «живых» примеров

Источник: «Чернев.Ру» — Позитивный блог