Microtip — библиотека подсказок CSS с собственными возможностями доступа

Вы можете выполнить быстрый поиск на GitHub, чтобы найти десятки пользовательских библиотек всплывающих подсказок. И кажется, что новые появляются в сети каждый месяц.

микроострия Это уникальный ресурс, так как он работает на чистых подсказках CSS, предлагает настраиваемую эстетику и использует исходный код, который полностью доступен для всех пользователей.

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

Читайте также: Руководство дизайнера по основам веб-дизайна доступности

На домашняя страницавы найдете ссылку на скачивание библиотеки Microtip вместе с кучей демонстраций кода.

Вы можете получить эту настройку через менеджер пакетов, прямую загрузку или извлекая ее непосредственно из CDN. Он поставляется с одним файлом CSS, и это в основном все, что вам нужно.

Как только Microtip добавлен на вашу страницу, вы можете начать добавлять всплывающие подсказки на элементы страницы. Они полностью соответствуют WAI поэтому они полностью соответствуют современным стандартам доступности.

Вот пример кода всплывающей подсказки, прикрепленный к элементу кнопки с пользовательской позицией:

Не так много кода, верно?

Эта библиотека очень легкая с общим объемом 1 КБ. Это просто безумие, учитывая, сколько вы получаете с этими подсказками.

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

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

Посмотрите на раздел настройки на главной странице для более подробной информации. Все работает через HTML и CSS, поэтому вам не нужны знания сценариев, чтобы это работало.

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

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

Если у вас есть вопросы или предложения по новым функциям, вы также можете написать об этом создателю в Twitter @_ighosh,

            <script async src="https://triu.ru/wp-content/litespeed/localres/aHR0cHM6Ly9wbGF0Zm9ybS50d2l0dGVyLmNvbS93aWRnZXRzLmpz" charset="utf-8"></script>

Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)