Требования к окружению

Featherlight ориентирована на работу в современных браузерах с корректной поддержкой DOM, CSS3 и стандартных событий JavaScript. Библиотека стабильно функционирует в актуальных версиях Chrome, Firefox, Safari и Edge. Поддержка устаревших браузеров возможна только в пределах возможностей подключённой версии jQuery и не гарантирует корректную работу анимаций и позиционирования.

Мобильные браузеры поддерживаются на уровне стандартного поведения touch-событий. Featherlight не требует отдельной мобильной версии, однако корректность отображения зависит от CSS-окружения проекта и viewport-настроек.

Зависимость от jQuery

Featherlight является плагином для jQuery и не может использоваться автономно.

Обязательные условия:

  • наличие глобального объекта jQuery или $;
  • версия jQuery не ниже 1.7 (для большинства сценариев рекомендуется 1.9+);
  • jQuery должен быть загружен до подключения Featherlight.

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

Подключение JavaScript-файлов

Для работы Featherlight требуется один основной JavaScript-файл библиотеки. Он может быть подключён:

  • напрямую через <script>;
  • через систему сборки (Webpack, Rollup, Vite) при использовании UMD-сборки;
  • через CDN при соблюдении политики безопасности сайта.

Важно, чтобы подключение происходило после загрузки jQuery и до выполнения пользовательского кода, который использует Featherlight.

CSS-окружение и стили

Featherlight не является полностью функциональной без своего CSS-файла.

Минимальные требования:

  • подключён оригинальный CSS Featherlight;
  • отсутствие глобальных CSS-правил, конфликтующих с position: fixed, z-index, box-sizing.

Библиотека использует:

  • фиксированное позиционирование для оверлея;
  • собственную систему слоёв;
  • стандартные CSS-анимации (opacity, transform).

Переопределение базовых стилей возможно, но должно учитывать внутреннюю структуру разметки Featherlight.

Требования к DOM и структуре документа

Featherlight предполагает корректно сформированный HTML-документ:

  • наличие <body> без нестандартных ограничений overflow;
  • отсутствие жёстких ограничений по высоте (height: 100%) на корневых контейнерах, если они не осмыслены;
  • корректную работу событий click, focus, keydown.

Инициализация плагина должна происходить после загрузки DOM. Использование $(document).ready() или эквивалентных механизмов обязательно при ручной инициализации.

Политика безопасности контента (CSP)

При использовании строгой Content Security Policy необходимо учитывать:

  • разрешение на inline-стили или использование хешей/nonce;
  • разрешение на загрузку ресурсов (изображений, iframe), отображаемых внутри lightbox;
  • корректную работу событий, завязанных на динамическое добавление DOM-узлов.

Featherlight не использует eval, но активно манипулирует DOM, что требует разрешений на style-src и img-src.

Серверное окружение

Featherlight не предъявляет требований к серверной платформе. Однако:

  • загрузка изображений и HTML-фрагментов должна происходить по доступным URL;
  • при использовании AJAX-контента сервер должен корректно обрабатывать CORS-заголовки;
  • MIME-типы ресурсов должны соответствовать содержимому.

Работа с изображениями и медиа

Для корректного отображения изображений:

  • сервер должен отдавать реальные размеры изображений;
  • изображения должны быть доступны без редиректов, мешающих загрузке;
  • желательно наличие атрибутов width и height для предотвращения скачков layout.

Featherlight не оптимизирует изображения и не управляет их загрузкой — это полностью ответственность окружения.

Доступность и взаимодействие с клавиатурой

Библиотека частично поддерживает управление с клавиатуры:

  • закрытие по клавише Esc;
  • управление фокусом внутри lightbox.

Для корректной работы:

  • страница не должна глобально перехватывать клавиатурные события;
  • не должны использоваться нестандартные фокусы без необходимости.

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

Совместимость с системами сборки

Featherlight поставляется в формате, совместимом с большинством сборщиков:

  • UMD-модуль для CommonJS и AMD;
  • возможность подключения как глобальной зависимости.

При использовании сборщиков важно:

  • исключить дублирование jQuery;
  • контролировать порядок импортов;
  • учитывать, что Featherlight модифицирует прототип jQuery.

Ограничения окружения

Featherlight не предназначена для:

  • серверного рендеринга без DOM (Node.js без эмуляции браузера);
  • окружений без поддержки CSS positioning;
  • строгих sandbox-контейнеров без доступа к document.body.

При соблюдении перечисленных требований библиотека интегрируется стабильно и предсказуемо в большинство клиентских JavaScript-проектов.

Оглавление