Lightbox это простой, ненавязчивый скрипт, который показывает изображения в окне на текущей странице.

Установка

Поскольку Lightbox зависит от библиотек Prototype и Scriptaculous, добавляем их:

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

Далее подключаем CSS:

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

Затем отмечаем ссылки на изображения, которые нам нужно показывать в lightbox-е при помощи атрибута rel:

<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

Значение атрибута title является необязательным и применяется для добавления подписи к изображениям. Если необходимо создать галерею изображений, то в атрибуте rel указываем в квадратных скобках уникальное имя галереи:

<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>

Запись добавлена 3 августа 2008 в категории Мультимедиа.Вы можете следить за комментариями используя ленту новостей RSS 2.0.Комментарии и пинги запрещены.