Компактный и простой в использовании плагины JavaScript – Popper.js с максимум возможностей для динамических всплывающих подсказок на сайте.
Если в Ваших задачах стоит потребность в небольших появляющихся боксах с каким-либо контентом, то Вам определенном стоит обратить внимание на плагины Popper.js.
Плагин самостоятельно определяет позиционирование элементов и благодарю своему алгоритму высчитывает координаты, где будет появляться подсказка. Также, вся работа производится без какой либо зависимости от внешних библиотек.
Работа с плагином для всплывающих подсказок на сайте:
<!-- подключаем библиотеку --> <script type="text/javascript" src="https://unpkg.com/popper.js"></script> <!-- подключаем универсальный скрипт, который использует API propper.js для упрощенного использование подсказок --> <script type="text/javascript" src="https://unpkg.com/tooltip.js"></script>
Ищем элемент с классом «my-button» и задаем расположение бокса с подсказкой «my-propper»
var reference = document.querySelector('.my-button');
var popper = document.querySelector('.my-popper');
var anotherPopper = new Popper(
reference,
popper,
{
// опции плагина
}
);
Перечень всех опций для упрощенного варианта tooltip.js находиться здесь, для полного функционала propper.js – здесь.
Скачать файлы плагина Вы можете по ссылке выше. Перед использованием рекомендуем ознакомиться с базовой документацией. Смотрите также другие плагины JavaScript.
