Вы можете передать параметры в виде объекта "ключ / значение" в функцию fancybox() или изменить их в нижней части файла FancyBox JS.
| Ключ | Значение по умолчанию | Описание |
|---|---|---|
padding |
10 | Пространство между оболочкой FancyBox и содержимым |
margin |
20 | Пространство между областью просмотра и оболочкой FancyBox |
opacity |
false | Если задано значение true, прозрачность содержимого изменяется для elastic-переходов |
modal |
false | Если true, overlayShow установлен на true и hideOnOverlayClick, hideOnContentClick, enableEscapeButton, showCloseButton установлены на false |
cyclic |
false | Если true, галереи будут циклическими, что позволит вам продолжать нажимая кнопку "Вперед / Назад". |
scrolling |
'auto' | Устанавливает CSS-свойство переполнения для создания или скрытия полос прокрутки. Может быть установлен как auto, yes, или no |
fancyClass |
'' | Возможность добавить кастомный CSS-класс. |
width |
560 | Ширина для типов содержимого iframe и swf. Также устанавливается для inline содержимого если autoDimensions установлен как false |
height |
340 | Высота для типов содержимого iframe и swf. Также устанавливается для inline содержимого если autoDimensions установлен как false |
minWidth |
100 | Минимальная ширина окна |
minHeight |
100 | Минимальная высота окна |
maxWidth |
9999 | Максимальная ширина окна |
maxHeight |
9999 | Максимальная высота окна |
autoScale |
true | Если true, FancyBox масштабируется по размеру области просмотра. |
autoDimensions |
true | Для inline и ajax представлений изменяет размер представления в соответствии с полученными элементами. Убедитесь, что он имеет размеры, иначе это даст неожиданный результат. |
fitWindowHeight |
true | Установка css-переменной с максимальным размером окна, в которое должно |
centerOnScroll |
false | Если true, FancyBox центрируется при прокрутке страницы |
ajax |
{ } | Параметры Ajax Примечание: error и success будут заменены FancyBox |
swf |
{wmode: 'transparent'} | Параметры для объекта swf |
hideOnOverlayClick |
true | Включает закрытие FancyBox по клику на оверлей |
hideOnContentClick |
false | Включает закрытие FancyBox по клику на содержимое окна |
overlayShow |
true | Включает оверлей |
overlayOpacity |
0.3 | Прозрачность оверлея (от 0 до 1; по умолчанию - 0.3) |
overlayColor |
'#666' | Цвет оверлея |
titleShow |
true | Включает заголовок |
titlePosition |
'outside' | Позиция заголовка. Может быть установлен как outside, inside или over |
titleFormat |
null | Callback для настройки области заголовка. Вы можете установить любой html - пользовательский счетчик изображений или даже пользовательскую навигацию |
transitionIn, transitionOut |
'fade' | Тип перехода. Может быть установлен как elastic, fade или none |
speedIn, speedOut |
300 | Скорость fade и elastic переходов, в миллисекундах |
changeSpeed |
300 | Скорость изменения размера при смене элементов галереи, в миллисекундах |
changeFade |
'fast' | Скорость исчезновения контента при смене элементов галереи |
easingIn, easingOut |
'swing' | Ослабление, используемое для elastic анимации |
showCloseButton |
true | Включает кнопку "Закрыть" |
showNavArrows |
true | Включает стрелки навигации |
enableEscapeButton |
true | Включает нажатие Esc для закрытия FancyBox |
onStart |
null | Будет вызываться прямо перед попыткой загрузки контента |
onCancel |
null | Будет вызван после отмены загрузки |
onBeforeShow |
null | Будет вызван перед отображением содержимого |
onComplete |
null | Будет вызываться после отображения содержимого |
onCleanup |
null | Будет вызван непосредственно перед закрытием |
onClosed |
null | Будет вызываться после закрытия FancyBox |
onError |
null | Будет вызываться при ошибке FancyBox |
onUpdate |
null | Будет вызываться при обновлении размеров окна FancyBox |
| Ключ | Описание |
|---|---|
type |
Тип содержимого. Может быть установлен как image, ajax, iframe, swf или inline |
href |
Источник контента |
title |
Заголовок |
content |
Содержимое (могут быть любые данные в формате html) |
orig |
Устанавливает объект, положение и размеры которого будут использоваться при elastic переходе. |
index |
Пользовательский начальный индекс галереи, созданной вручную (начиная с 1.3.1) |
FancyBox предоставляет некоторые функции для работы с ним:
| Метод | Описание |
|---|---|
$.fancybox.showActivity |
Показывает анимацию загрузки |
$.fancybox.hideActivity |
Скрывает анимацию загрузки |
$.fancybox.next |
Отображает следующий элемент галереи |
$.fancybox.prev |
Отображает предыдущий элемент галереи |
$.fancybox.pos |
Отображает элемент по индексу из галереи |
$.fancybox.cancel |
Отменяет загрузку контента |
$.fancybox.close |
Скрывает FancyBox Внутри iframe используйте - parent.$.fancybox.close(); |
$.fancybox.resize |
Автоматически изменяет высоту FancyBox в соответствии с высотой содержимого |
$.fancybox.center |
Центрирует FancyBox в области просмотра (центрирование с версии 1.5.0 производится на css) |
$.fancybox.update |
Обновляет размеры окна FancyBox |
FancyBox генерирует события, аналогичные callback-функциям: onStart, onCancel, onBeforeShow, onComplete, onCleanup, onClosed, onError, onUpdate.
| Событие | Описание |
|---|---|
fancybox-onStart |
Создаётся прямо перед попыткой загрузки контента |
fancybox-onCancel |
Создаётся после отмены загрузки |
fancybox-onBeforeShow |
Создаётся перед отображением содержимого |
fancybox-onComplete |
Создаётся после отображения содержимого |
fancybox-onCleanup |
Создаётся непосредственно перед закрытием |
fancybox-onClosed |
Создаётся после закрытия FancyBox |
fancybox-onError |
Создаётся при ошибке FancyBox |
fancybox-onUpdate |
Создаётся при обновлении размеров окна FancyBox |