Tippy.js - Perpustakaan Alat Petua Javascript Lightweight Lightweight

Petua berguna untuk menunjukkan sedikit kandungan tambahan. Mereka menjimatkan ruang pada halaman dan memberi anda ruang untuk menghidupkan sesuatu yang menarik perhatian orang.

Pada masa lalu, kami telah melengkapkan skrip tooltip tetapi banyak pembangun mahukan perpustakaan khusus. Sesetengah suka jQuery, yang lain mahu JS vanila mudah.

Plugin Tippy berfungsi paling baik untuk kumpulan yang terakhir yang ingin bekerja dengan kod vanila JS.

Dengan Tippy.js anda dapat pustaka tooltip berfungsi sepenuhnya berjalan di atas Popper.js. Ini bermakna plugin itu datang dengan kebergantungan kecil, tetapi jauh lebih mudah untuk diurus daripada perpustakaan jQuery.

Jadi apa keindahan Tippy? Ia menambah ke gaya Popper lalai untuk mencipta lebih banyak petua dinamik dengan kesan yang luar biasa.

Anda boleh menambah pudar, slaid, gelangsar, jangka masa adat, kaedah panggilan balik, dan juga kesan dinamik seperti alat poket auto-berputar.

Benar-benar plugin ini akan mengambil alat-alat anda sehingga ke tahap yang baru dengan ciri-ciri kegunaan yang jelas. Anda boleh menyimpannya petua tetap ke skrin dengan unsur halaman tertentu, atau ubah orientasi mereka jika skrin terlalu kecil.

Ia juga menyokong peranti sentuh yang menjadikannya sesuai untuk susun atur responsif. HTML tooltip dilabel menggunakan standard ARIA untuk mencapai kebolehcapaian maksimum. Saya tidak boleh memikirkan apa-apa yang tidak baik untuk mengatakan tentang plugin ini!

Jika anda ingin mencuba ini di laman web anda sendiri, muat turun salinan kod sumber dari GitHub. Ini termasuk fail plugin utama bersama dengan butiran cara memasangnya menggunakan npm.

Fail skrip Tippy.js lalai disertakan dengan Popper.js disertakan supaya anda tidak perlu memuat turun pustaka tambahan itu. Apa yang anda perlukan adalah fail JS / CSS lalai dan halaman web untuk menjalankan tooltip.

Jika anda ingin menggali lebih jauh ke dalam beberapa contoh, lihat di laman web Tippy.js yang termasuk sampel langsung + potongan kod yang anda boleh salin dan gunakan semula.