UPD 2014-02-14

quickbox

Предлагаю вашему вниманию новую версию QuickBox — это скрипт для просмотра фотографий на сайтах. Вес скрипта менее 5 кб, его установка не требует специальных навыков в программировании.

Скрипт в работе выглядит так:

qb-work

В этой версии переработан и оптимизирован код, изменилась установка.

Что такое QuickBox?

QuickBox — это очень простой js-скрипт, использующий библиотеку jquery. Главная функция скрипта — увеличение фотографий как это показано на примере выше. Для примера работы скрипта я сделал эту страницу с четырьмя картинками. Их может быть любое количество.

Установка

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

<script src="/quickbox/quickbox.js"></script>
<link rel="stylesheet" type="text/css" href="/quickbox/quickbox.css">

Перед подключением убедитесь, что у вас подключён jQuery версии не ниже 1.7.0. Если нет, подключите:

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

Убедитесь, что правильно указан путь к папке с файлами скрипта.

Настройка

Чтобы скрипт увеличивал именно те фотографии, которые нужно, присвойте ссылкам на них класс quickbox. Больше ниего делать не нужно. Вот пример такого кода:

<a class="quickbox" href="01.jpg" title="Без проблем, ты тоже можешь быть вегетарианцем"><img alt="" src="01s.jpg"></a>
<a class="quickbox" href="02.jpg" title="Интересно, в каком банке реально смогут сделать прекрасную?"><img alt="" src="02s.jpg"></a><br>
<a class="quickbox" href="03.jpg" title="Очень старая футболка"><img alt="" src="03s.jpg"></a>
<a class="quickbox" href="04.jpg" title="И правда, зачем пытаться?"><img alt="" src="04s.jpg"></a>

Посмотреть и скачать

Скрипт бесплатный, пользуйтесь им в удовольствие. Пожалуйста, не пытайтесь его продать. Лучше поддержите разработку денежной помощью.

Как всегда, жду ваших комментариев и советов.

    Отправить ответ

    21 Комментарий на "QuickBox 0.3.0 — скрипт для просмотра фотографий"

    Уведомлять
    avatar
    5000
    PRoHtml
    Гость

    Ок, согласен, тем более я нашел решение наконец-то. Я ведь его вывожу не просто в код, а плагином с автоматической установкой из админки, поэтому просто обязан сделать работающим в любом конфиге.
    Но уже все позади, так что, еще раз спасибо за скрипт, теперь буду уже обсуждать версию 0.5 в соответствующей теме.

    PRoHtml
    Гость
    В версии 0.5 да, рассчитывается автоматически. А в версии 0.3.0 там он в самый верх скроллится при клике, и берет стили из css : top: 10%, я говорю о версии которую скачивал недели три назад, вот фрагмент: function imgShow(url, ttl, crnt) { jQuery("#sshow_imgs a").removeClass("sshow_act"); jQuery("a[rel='"+crnt+"']").addClass("sshow_act"); img = new Image(); img.src = url; jQuery(img).load(function(){ imgLoaded(url, ttl); img_width = img.width + 30; img_height = img.height + 70; var nx_x = ((jQuery(window).width()) - img_width)/2; jQuery("#sshow_img").attr("rel", crnt); jQuery("#sshow").animate({marginLeft:nx_x, width: img_width},700); jQuery("#sshow").css("height", img_height); }); } Насчет конфликта в версии 0.5 , тут такое дело: В админке есть пункт *объединять css js* , который соответственно объединяет… Читать дальше »
    PRoHtml
    Гость

    Добрый день,
    я видел в комментариях, что раньше принудительного скроллинга вверх не было, где можно скачать версию 0.3.0, открывающуюся тут же, а не в top:10%?
    нужна именно версия 0.3.0, так как в 0.5 наблюдается конфликт с некоторыми местами в плагинах системы управления. Для системы которую я использую, версия 0.3.0 как раз подходит идеально.

    PRoHtml
    Гость

    Добрый день Назар, отличный скрипт, мне очень понравился, использую на своем сайте, и даже решил собрать его в виде плагина под CMF Cotonti, добавил к нему jScale Image Scaler. Указал вас в качестве автора скрипта, и поставил открытую ссылочку со страницы поддержки плагина Quickbox2
    В самом плагине тоже указал ваши данные и адрес сайта.

    В админпанели данные об авторе скрипта также присутствуют.

    PRoHtml
    Гость

    Добрый день, Назар, измените пожалуйста ссылку в комментарии. Я указывал страницу с плагином, на основе quickbox, на которой стоит ссылка на вас.

    Сделаны некоторые изменения в структуре, постоянный адрес плагинов изменился, а соответственно и страница со ссылкой на скрипт. Новый адрес страницы:

    QUICKBOX2

    Михаил
    Гость

    Чувак! Такие скрипты и бесплатно! Просто фигею, что есть такие люди! Спасибо большое!

    Павел
    Гость

    Здравствуйте! Скажите, а этот скрипт работает в VM2? Внешне кажется, что вполне смог бы, но лучше удостовериться у Вас

    Павел
    Гость

    @Назар Токарь, Класс) Спасибо, я тоже поставлю)

    Роман
    Гость

    Отлично. Очень легкий, очень простой в настройке. Думаю это то, что я теперь буду использовать постоянно.

    Роман
    Гость

    По истечении некоторого срока, пришел поделиться впечатлениями. Установил на корпоративные сайты. Установка заняла минуту. Работает шустро, настройки скрипта легки и понятны. Для любого изображения прописывается в 2 секунды. Это лучшее решение на мой взгляд. А в связи с возможностью легкой настройки и изменения внешнего вида, пожалуй внедрю его на всех имеющихся и на всех будущих сайтах.

    Владимир Кормилицын
    Участник

    Установил скрипт для увеличения фотографий. Честно говоря
    не в восторге! 1. Все записи на странице стали ссылками.
    2.увеличенная картинка находится в верхнем левом углу экрана и
    верхнюю часть закрывает окно браузера. 3. не вижу возможности
    изменить положение и размеры увеличенной картинки. 4.кроме этого
    окна,в котором пишу,не нашел, где ещё можно задать вопросы на эту
    тему.

    Денис
    Гость

    Использую эти полезные скрипты. Они просты, легкие и понятные. Нет ненужного кода – нет проблем в установке и эксплуатации

    wpDiscuz