QuickBox 0.5

Простой и быстрый скрипт для увеличения фотографий.

Подойдет всем

Интернет-магазины, блоги, персональные сайты — скрипт можно использовать на любом ресурсе.

Простота

Установка производится за десять минут, а для работы подойдут даже устаревшие версии jQuery (от 1.4), если вы не хотите ничего кардинально менять.

Удобство

Управлять просмотром фотографиями можно прямо с клавиатуры.

Кнопки и — листание влево-вправо, а Esc — закрыть просмотрщик.

Что такое QuickBox

QuickBox — простой скрипт для увеличения фотографий. Для примера его работы я сделал эту страницу с несколькими картинками. Фотографий может быть любое количество. Скрипт подойдёт для любого сайта, в частности для просмотра увеличенных фотографий в интернет-магазинах. QuickBox умеет работать со всеми современными браузерами (Firefox, Opera, Google Chrome, IE10+)

Демо Как работает QuickBox

Это пример того, как ведет себя QuickBox в работе. Смело нажимайте на любую картинку.

Пора спать
Поход
Лошадь неодобрительно наблюдает, как желтеют листья
На небе только и разговоров, что о море
Никогда не знаешь, когда придется снова учиться. Стараюсь делать это всегда.
На такой же когда-то ездил Луи де Фюнес

Подключение

Чтобы подключить скрипт, закачайте файлы из архива в любую папку к себе на хостинг и добавьте в тег head такие строки:

<script src="qb/js/qb.js"></script>

Убедитесь, что у вас подключён jQuery; если пока нет, то подключите отсюда. Проверьте что путь к папке с файлами скрипта указан правильно. Для работы QuickBox требуется jQuery версии не ранее 1.4.

Настройка

Чтобы изображение открывалось в новом слое при помощи QuickBox, присвойте прямой ссылке на него class="quickbox". Больше ничего делать не нужно. Подпись под фото будет взята из атрибута title или alt. Вот пример:

<a class="quickbox" href="i/06.jpg" title="Описание фотографии">
<img src="i/06s.jpg" alt="">
</a>

Описание фотографии можно также указывать в атрибуте alt или title для самого фото. Впрочем, можно и не указывать совсем, как вам удобнее. Как видите, перейти на этот скрипт очень просто.

Вернуться в блог.