Microtip - Knižnica CSS Tooltip s vlastnosťami nažívanej prístupnosti
Môžete urobiť rýchle vyhľadávanie na GitHub, aby ste našli desiatky vlastných knižníc nástrojov. A zdá sa, že každý nový mesiac narazí na web.
Microtip je unikátny zdroj, pretože pracuje na čistých CSS nástrojoch, ponúka vlastnú estetiku a používa zdrojový kód, ktorý je plne prístupné pre všetkých používateľov.
Ak ste o prístupnosti nikdy veľa neuvažovali, Microtip by mohol zmeniť názor. Je to perfektná zmes čistého dizajnu funkčnosť pre všetky zariadenia, pre všetky prehliadače a pre používateľov s vážnymi poruchami.
Na domovskej stránke nájdete odkaz na stiahnutie do knižnice Microtip spolu s množstvom demoverzi kódu.
Toto nastavenie môžete získať prostredníctvom správcu balíkov, priamym preberaním alebo stiahnutím priamo z CDN. to prichádza s jedným súborom CSS a to je v podstate všetko, čo potrebujete.
Po pridaní Microtip do vašej stránky môžete začať pridávať popisy na prvky stránky. Toto sú plne v súlade s WAI takže dokonale spĺňajú moderné štandardy prístupnosti.
Nižšie je uvedený vzorový popisovací kód pripojený k prvku tlačidla s vlastnou polohou:
Nie je moc správny kód?
Táto knižnica je veľmi ľahká s minimálnou veľkosťou 1 kB. To je len blázon zvážiť, koľko máte s týmito tooltips.
Vlastné vlastnosti CSS môžu byť odovzdávané prostredníctvom atribútov HTML na definovanie veľkosti písma, štýlu prechodu, uvoľnenia a množstva ďalších nastavení.
Môžete tiež prepísať priamo CSS, aby sa nápady rozšírili s rôznymi farbami alebo písmy.
Pozrite si sekciu prispôsobenia na hlavnej stránke, kde nájdete ďalšie podrobnosti. Všetko prechádza cez HTML a CSS, takže nepotrebujete akékoľvek skriptovacie znalosti aby to fungovalo.
Microtip je super jednoduché nastavenie a prispôsobenie takže ak poznáte aspoň základné kódovanie frontend, budete v poriadku.
Ale pozrite sa na repozitáre GitHub, kde nájdete viac informácií o nastavení a získate kópiu štýlu šablón.
Ak máte otázky alebo návrhy nových funkcií, môžete tiež odstrániť riadok na tvorcovi v službe Twitter @_ighosh.