Modalbox — создаем диалоговые окна
Modalbox — библиотека на prototype и script.aculo.us для создания диалоговых окон и мастеров, обьем ее кода всего 10кб. На мой взгляд это настоящий атрибут веб два нольности. Modalbox работает в IE6, IE7, Firefox 1.0, 1.5, 2.0, Safari, Camino, Opera 8 и 9. Вот так выглядит окно мастера созданного с помощью modalbox:
Установка
- Скачайте ModalBox и распакуйте его в папку, например в /includes(у вас уже должны быть prototype + script.aculo.us библиотеки, так как они нужны для работы Modalbox.)
-
Подключите все необходимые библиотеки, вставив код указанный ниже между тегами 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>
-
Подключите 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 без перезагрузки страницы.
Рекомендуем почитать
