Tingle.js - безкоштовний сценарій ванільного JS-модального вікна для мінімалістів

Модальні вікна швидко замінили вікно сповіщення браузера за умовчанням. Добре розроблені моделі більш сумісні з чудовим досвідом користувача Модальні вікна постачаються з багатьма користувацькими ефектами та дизайном.

Можна будувати чисті CSS-модальні пристрої, але їм часто не вистачає певних je ne sais quoi що ви знайдете в скриптах, які працюють на JS.

І одним з моїх улюблених є Tingle.js, безкоштовне модальне вікно JavaScript, створене для мінімалістських веб-сайтів.

Ця бібліотека існує протягом деякого часу, але вона все ще технічно в розвитку версії 1.0 з частими вдосконаленнями.

Але це стабільний скрипт, що працює на чистому ванільному JS так що ви можете використовувати це в будь-якому місці. Це не вимагає ніяких знань ECMAScript, ані вам потрібні якісніші бібліотеки типу TypeScript.

Все в Tingle.js добре задокументоване і навіть поставляється з чітким API для налаштування анімації, ефектів кнопок і функцій зворотного виклику.

Погляньте на репо GitHub більше інформації з посиланнями на головний API і функції зворотного виклику, всі з яких ви знайдете детально на домашній сторінці Tingle.js.

Якщо вам зручно редагувати JavaScript, вам сподобається цей плагін. Це дуже легко працювати, а CSS-коди ще простіше перезаписувати за допомогою власної таблиці стилів.

Основна документація чітко окреслена живими прикладами скопіюйте / вставте в свій HTML.

Tingle.js - досить простий сценарій. Вам сподобається те, як він працює, або ви не будете.

Через кілька хвилин на головній демонстраційній сторінці, ви повинні бути в змозі сказати, чи подобається вам це чи ні. Він підтримує стільки кнопок, скільки вам потрібно разом з полями введення користувача, якщо ви хочете витягнути інформацію від користувача.

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

Безумовно, один з найбільш добре підтримуваних модальних вікон там, і чистий дизайн легко перекласти для будь-якого макета.