Tippy.js - Biblioteka podpowiedzi w języku JavaScript o lekkiej wadze

Podpowiedzi są przydatne do pokazywania małych bitów dodatkowej zawartości. Oszczędzają miejsce na stronie i dają pokój do animacji czegoś, co przyciąga uwagę ludzi.

W przeszłości omówiliśmy skrypty podpowiedzi, ale wielu programistów chce tworzyć własne biblioteki. Niektórzy wolą jQuery, inni chcą prostego waniliowego JS.

Wtyczka Tippy działa najlepiej dla tej drugiej grupy którzy chcą pracować z kodem waniliowym JS.

Z Tippy.js otrzymasz w pełni funkcjonalna biblioteka podpowiedzi działa na górze Popper.js. Oznacza to, że wtyczka ma niewielką zależność, ale jest dużo łatwiejsza do zarządzania niż biblioteka jQuery.

Jakie jest piękno Tippy? Dodaje do domyślnych stylów Poppera do tworzenia bardziej dynamiczne podpowiedzi z niesamowitymi efektami.

Możesz dodawać zaniki, slajdy, ruchy, niestandardowe czasy trwania, metody wywołania zwrotnego, a nawet efekty dynamiczne, takie jak automatyczne obracanie etykietek.

Naprawdę ta wtyczka przeniesie twoje podpowiedzi na zupełnie nowy poziom dzięki dobrze zdefiniowanym funkcjom użyteczności. Możesz zatrzymać podpowiedzi przymocowane do ekranu za pomocą pewnych elementów strony, lub zmień ich orientację, jeśli ekran stanie się zbyt mały.

Obsługuje również urządzenia dotykowe, dzięki czemu jest idealny do responsywnych układów. Etykietka HTML jest oznaczona za pomocą standardów ARIA dla maksymalnej dostępności. Nie mogę powiedzieć nic złego o tej wtyczce!

Jeśli chcesz spróbować tego w swojej własnej witrynie, pobierz kopię kodu źródłowego z GitHub. Obejmuje to główne pliki wtyczek wraz ze szczegółami, jak je zainstalować za pomocą npm.

Domyślny plik skryptu Tippy.js zawiera dołączony plik Popper.js, więc nie musisz nawet pobierać tej dodatkowej biblioteki. Wszystko, czego potrzebujesz, to domyślny plik JS / CSS i strona internetowa do uruchamiania podpowiedzi.

Jeśli chcesz zagłębić się w kilka przykładów, spójrz na stronę domową Tippy.js, która zawiera próbki na żywo + fragmenty kodu, które możesz skopiować i wykorzystać ponownie.