br 8eb34


search

Модуль VTEM Image Zoom

vtem-img-zoomДля детального просмотра изображения представленных на сайте пригодится модуль VTEM Image Zoom. С помощью этого модуля картинка добавленная в модульной позиции может быть увеличена в квадратной области, как при наведении лупой на объект. Вместе с модулем в комплекте идет плагин, также позволяющий увеличивать изображения. Расширение работает практически во всех браузерах и использует библиотеку jQuery.

vtem-img-zoom1

Основные возможности

  • добавление одной или нескольких изображений в позиции модуля
  • выбор позиции для окна с увеличенным изображением
  • возможность показа изображений в виде галереи
  • выбор размещения мини-эскизов в галереи
  • включение\отключение библиотеки jQuery

Установка и настройка модуля VTEM Image Zoom

Существуют версии для установки модуля для Joomla 1.5 - 2.5, а также для Joomla 3.x. Устанавливается из менеджера расширений после чего требуется активация и настройка параметров:

  • Module width - ширина модуля в пикселях
  • Zoom Title - заголовок для увеличенного изображения
  • Image URLs - указать одну или несколько ссылок на изображение
  • Small image URLs - одна или несколько ссылок на уменьшенное изображение
  • Zoom width/Height - ширина окна увеличения
  • Position - выбор позиции окна увеличения (по разным сторонам или внутри - inside)
  • adjustX \ Y - регулировать расположение окна увеличения по оси X \ Y
  • Soft Focus - использовать или нет эффект размытия при наведении на мини-эскиз
  • Tint color - выбор цвета, который будет покрывать участки мини-эскиза при наведении
  • Tint Opacity - прозрачность цвета при наведении
  • Show Title - показывать или нет заголовок
  • Title Opacity - указать степень прозрачности заголовка
  • Thumbnail scroller - можно использовать просмотр мини эскизы в виде карусели
  • Thumbnail position - выбор расположения мини-эскизов галереи (снизу или сверху)

В дополнительных параметрах можно указывать суффикс класса модуля, включать\отключать библиотеку jQuery, использовать стили CSS, выбирать режим и время кэширования.

Использование плагина VTEM Image Zoom в материале.

Для активации изображения с увеличением следует использовать следующие теги:

Стандартный режим

{vtemzoom image=[images/big1.jpg] thumb=[images/small1.jpg]}

Режим с красным цветом на уменьшенном изображении

{vtemzoom image=[images/big1.jpg] thumb=[images/small1.jpg] tintcolor=[#FF0000]}

Режим с увеличением внутри

{vtemzoom image=[images/big1.jpg] thumb=[images/small1.jpg] position=[inside]}

Режим с размытием

{vtemzoom image=[images/big1.jpg] thumb=[images/small1.jpg] softFocus=[1]}

Режим с галереей

{vtemzoom image=[images/big1.jpg,images/big2.jpg,images/big3.jpg] thumb=[images/small1.jpg,images/small2.jpg,images/small3.jpg] scroll=[1]}

Спонсором данной статьи сегодня выступает компания Экан, которая занимается влагомерами - это специальные приборы для измерения показателя качества зерна.

demo

Добавить комментарий

Защитный код
Обновить

Комментарии