Lightbox2 на вашем сайте.

Многие хотели бы использовать такой эффект на своих сайтах, но думают, что это возможно только в платных шаблонах изготовленных профессионалами. Но такой эффект доступен не только в шаблонном исполнении, и не только профи веб-дизайно, но и всем кто может удилить пару минут на чтение инструкции и применениее ее на деле. Вам нужно скачать архив с файлами и следовать инструкции установки. Все что требуется - это немного дополнить (4 строчки) ваш шаблон сайта.

Скачать файл можно вконце статьи.

Как использовать

Шаг 1 - Установка

Lightbox 2 использует Prototype Framework и Scriptaculous Effects библиотеки. Вам нужно включить все Javascript файлы в тег header .

<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>
Включите Lightbox CSS файл (или дополните ваш css).

<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
Проверьте CSS и создайте прозрачный prev.gif и next.gif афйлы и расположите на сайте. После создайте loading.gif и close.gif файлы .

Шаг 2 - Активация

Добавьте rel="lightbox" атрибут к любой ссылке если хотите использовать эффект lightbox. Для примера:

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

Дополнение: Используйте title атрибут если нужно описание к картинке.
Групповое использование. К примеру:

<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>
Lightbox v2.04

Добавить в любимые

Закладка

На почту

Кликов: 6240

Комментарии (1)

...
Автор: Trial , марта 05, 2010

Хорошее описание Lightbox2.
Если делать много руками (без скриптов и ботов), то ОЧЕНЬ пригодится данный материал.
Спасибо за перевод.

Сообщить админу

Голос против

Голос за

Голосов: +1

Показать/скрыть форму отправки комментария

Написать комментарий

О портфолио. Что нужно вашему сайту?

Фильтр Яндекса

“Фильтр Яндекса "ты последний" накладывается на сайт, документы которого являются неуникальным контентом. Вследствие наложения подобного фильтра, сайт попадает на последние места в выдаче.”

SEO сервисы / SEO tools - Добавление сайта в поисковые системы, анализ запросов, Определение позиций в поисковиках, Анализ сайта, Анализ плотности слов, Определение PR, Ключевые слова , Оценка ресурса. Покупка и продажа ссылок, SEO-форумы...

Библиотека сайтостроения!

Здесь собраны материалы о сайтостроении и все те мелочи, с которыми Вам, вполне вероятно, прийдется столкнуться при создании сайта, верстке html страничек и просто могут быть использованы для ознакомления.

Хотите узнать как настраивать CMS Joomla! и оптимизировать ее для поисковых машин? Как организовать заголовки материалов (title), описание страниц (description) и поднять PageRank ? Все что требуется для правильного SEO (Search Engine Optimisation).
Перейти в раздел "Библиотека сайтостроения"