Dodajte oznake opisa jednostavne slike s oznakom Taggd
Znate kako vam Facebook omogućuje lica s oznakom na fotografijama? Dobro, Taggd je kao CSS / JS ekvivalent pomoću točaka za notaciju gdje se na slici moraju pojaviti opisi alata.
Knjižnica je potpuno besplatna, i ne zahtijeva nikakve ovisnosti kao što je jQuery. To radi na čistom vanilijskom JavaScriptu, i vrlo je jednostavno postaviti.
Možete saznati nešto više s Taggd početne stranice koja uključuje demo i neke osnovne korake za početak.
Tu je i veza s online dokumentacija koristeći Doclets, urednu malu web aplikaciju napravljenu za JS dokumentaciju. Možeš pretražite verzije Taggd, ili pregledajte trenutnu verziju u glavnoj grani.
Odatle, dobit ćete ogroman popis nekretnina možeš koristiti. Svaki dokument je podijeljen po funkcijama koje rade na slici (kao što je addTag ()
ili getTag ()
) nakon čega slijede funkcije koje vam pomažu manipulirati određenim oznakama (kao što je setPosition ()
).
Opet, sve radi na JavaScriptu vanilije tako da ne morate brinuti o pitanjima sintakse.
Započeti pogledajte GitHub repo, i slijedite upute za postavljanje.
Vi samo dodajete Taggd CSS i JS datoteke u svoj odjeljak , i onda stvorite novu instancu elemenata Taggd. One se mogu definirati jedan po jedan ili u nizu.
Zatim dodajte ih na sliku, i presto! Sve je spremno.
Voljela bih vidjeti dodatne značajke za prilagodbu oznaka oznaka, i promijeni svoj oblik. Bilo bi strašno stvoriti kvadratnu oznaku koja okružuje objekt, a ne malu ružičastu točku. Ali za besplatnu knjižnicu s nula ovisnosti, ne mogu se mnogo žaliti.
Do sada je ova knjižnica napravljena samo za moderne preglednike, i ne podupire gracioznu degradaciju. Međutim, uvijek možete otvoriti problem na repo stranici ili pokušati riješiti druge probleme ako vidite neke jednostavne. Unatoč tome, Taggd je i dalje pravi dodatak i praktičan je za korištenje u bilo kojem projektu.
Pogledajte početnu stranicu autora za uzorak koda i DL veze zajedno s link na stranicu s dokumentacijom.
A ako imate bilo kakvih pitanja ili prijedloga slobodno pošaljite poruku kreatoru Timu Severienu na njegov Twitter @TimSeverien.