Полигон GriffinJS

Все виджеты слоя на одном экране — предмет браузерных тестов на трёх движках и ручной матрицы. Второй прогон идёт с отключённым скриптом: каждый блок без бейджа обязан работать и так.

griffinjs.js не подключён docs/griffinjs-lab.html

Дорожка

Scroll-snap-дорожка листается средствами браузера — свайп, инерция, колесо, RTL: так выглядит слайдер у читателя, который не подключил griffinjs.js. Со скриптом data-gr-track добавляет клавиатуру (стрелки, Home, End), aria-current и inert на слайдах, --gr-progress и событие griffin:change. Точки, кнопки и автоплей приедут с виджетом slider в фазе 21c.

scroll-snap: без скрипта — листается, со скриптом — нужен griffinjs.js клавиатура и aria

Слайд 1

Слайд 2

Слайд 3

Слайд 4

Слайдер

Автоплей 3 с, цикл нужен griffinjs.js

Первый

Второй

Третий

Три в ряд, постранично, rewind нужен griffinjs.js

Цикл с клонами краёв нужен griffinjs.js

Движок fade нужен griffinjs.js

Параллакс

--gr-progress от положения на экране нужен griffinjs.js

параллакс

Галерея

Превью ведут дорожку нужен griffinjs.js

Лайтбокс

Группа из двух кадров нужен griffinjs.js

Мегаменю

Шапка с панелями во всю полосу; вторая панель — ajax нужен griffinjs.js

Дропдаун

Контроллер на трёх формах: <details>, popover, наведение нужен griffinjs.js

Подсказка

В блоке с overflow: hidden: со скриптом — в верхнем слое, без него обрезается нужен griffinjs.js

Окна

Модалка, панель с hash, окно с ajax — через data-gr-open нужен griffinjs.js

Комбобокс

Источник — функция; наберите «а» нужен griffinjs.js

Мультивыбор: теги перед полем, значение — в <select multiple> нужен griffinjs.js

Сортируемая таблица

Три типа значений в одной таблице; со скриптом — щелчок и Enter по заголовку нужен griffinjs.js

Заказы: текст, дата и сумма
Город	Дата	Сумма
Пермь	2026-08-30	24 800 ₽
Ёлкино	2026-01-09	113 200 ₽
Азов	2026-08-05	5 900 ₽
Яровое	2026-09-14	999 ₽