Домашня » Інструментарій » Створіть бульбашки мовлення на сторінці з Popper.js

    Створіть бульбашки мовлення на сторінці з Popper.js

    Всі знають підказки Є десятки вільних ресурсів, які допоможуть вам зробити їх. Однак, бульбашки користувацького повідомлення або “попперс” також дуже корисні.

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

    Якщо ви хочете створити їх спливаючу підказку тоді на вашому сайті Popper.js є найкращим вибором. Це безкоштовний плагін відкритого коду, розміщений на офіційному сайті js.org.

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

    З Popper.js, вам не потрібно чекати, коли користувач наведеться лише для створення підказки. Замість цього ви можете змусити поппера до з'являються в будь-якому місці, будь-якого розміру, будь-якого кольору, з динамічним позиціонуванням.

    Перегляньте демо-сторінку Popper.js, щоб дізнатися, що я маю на увазі. Він поставляється з широкий спектр функцій позиціонування що дозволяє автоматично перевертати положення popper на основі розташування екрана.

    Коли користувач прокручує сторінку, вони можуть втратити міхур. За допомогою цього плагіна можна примусово повертайте його до зору перевертаючи його (або вниз), залежно від напрямку прокрутки користувача.

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

    Весь вихідний код доступний безкоштовно на GitHub, якщо ви хочете перевірити його.

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

    Якщо ви хочете дізнатися більше про розробку, ознайомтеся з цим блогом, написаним творцем Федеріко Зіволо.