Popper.js — маленький плагин всплывающих подсказок для сайта

Компактный и простой в использовании плагины 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.