Cloud Zoom

Cloud Zoom - небольшой плагин jQuery для создания эффекта масштабирования для изображений.

Стандартные установки с галереей

Миниатюра 1 Миниатюра 2 Миниатюра 3

Наведите курсор мыши на большое изображение, чтобы увидет эффект в действии.

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

Вид уменьшеной копии, линзы и окна с большим изображением может быть изменен с помощью CSS.

Особенности

  • Работает в большинстве браузеров (прошел проверку в IE6+, Firefox, Chrome, Opera, Safari).
  • Простая интеграция в код HTML.
  • Маленький: 6Kb (минимизированный).
  • Плавное пермещение линзы.
  • Режим галереи.
  • Режим подкрашивания, фокуса и внутренней линзы.
  • При отключенном JavaScript сохраняет структуру документа.

Режим подкрашивания

Добавляется подкрашивание любым цветом маленького изображения. Интенсивность подкрашивания настраивается (на приимере используется красный цвет с интенсивностью 50%).

В данном примере плавность имеет самое лучшее значение для создания эффекта дрейфа.

Внутренняя линза

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

Фокус

Используется эффект расфокусирования уменьшенной копии.

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