Tippy.js - ľahká Vanilla Javascript Tooltip knižnica

Nástrojové tipy sú užitočné pre zobrazenie malých kúskov extra obsahu. Ušetria miesto na stránke a poskytnú vám priestor na oživenie niečoho, čo upúta pozornosť ľudí.

V minulosti sme skryli skripty s nástrojovými popismi, ale veľa vývojárov chce vlastné knižnice. Niektorí preferujú jQuery, iní chcú jednoduchú vanilku JS.

Tippy plugin funguje najlepšie pre druhú skupinu ktorí chcú pracovať s vanilkovým JS kódom.

S Tippy.js dostanete plne funkčná knižnica nástrojov beží na vrchole Popper.js. Znamená to, že plugin má malú závislosť, ale je oveľa jednoduchšie spravovať ako knižnica jQuery.

Takže čo je krása Tippy? Pridáva sa na predvolené štýly Popper, ktoré sa majú vytvoriť dynamickejšie tipy s neuveriteľnými účinkami.

Môžete pridať módne efekty, diapozitívy, pohyby, vlastné trvanie, metódy spätného volania a dokonca aj dynamické efekty, ako sú automatické otáčanie nástrojov.

Skutočne tento doplnok vás prevedie na úplne novú úroveň s dobre definovanými funkciami použiteľnosti. Môžete si to udržať tipy na nástroje, ktoré sú na obrazovke pripevnené s určitými prvkami stránky, alebo nechajte ich meniť orientáciu, ak je obrazovka príliš malá.

Tiež podporuje dotykové zariadenia, ktoré robia toto ideálne pre citlivé rozloženie. Nápoveda HTML je označená pomocou štandardov ARIA pre maximálnu dostupnosť. Nemôžem premýšľať o ničom zlom, čo by som povedal o tomto plugin!

Ak to chcete vyskúšať vo vlastnej sieti, stačí stiahnuť kópiu zdrojového kódu od spoločnosti GitHub. Obsahuje hlavné súbory doplnkov spolu s podrobnými informáciami o tom, ako ich nainštalovať pomocou npm.

Predvolený súbor skriptu Tippy.js je dodávaný s Popper.js, takže si ani túto extra knižnicu nemusíte stahovať. Všetko, čo potrebujete, je predvolený súbor JS / CSS a webová stránka na spustenie popisov.

Ak chcete ďalej skopírovať niektoré príklady, pozrite sa na domovskú stránku Tippy.js, ktorá obsahuje živé vzorky + úryvky kódu, ktoré môžete skopírovať a opätovne použiť.