Sukurkite kaskadinius efektus lengvai naudojant „CascadeJS“

Išgalvotas animacija yra dešimtukas internete. Jie lengviau sukurti su neįtikėtinais tonais animacinių bibliotekų.

Cascade.js yra dar viena biblioteka, kurią norite pridėti prie sąrašo, ir tai tikrai unikalus. Naudodami „Cascade“, galite sukurti pasirinktinius animacijos efektus pakopinės raidės teksto arba kaskadiniai elementai pagrindiniame inde.

Ši biblioteka yra jokių priklausomybių; jis veikia klasikiniame „JavaScript“. Galite ją įdiegti per „npm“, „Bower“ arba atsisiųsdami kopiją iš „GitHub“.

Kad gautumėte „CascadeJS“ darbą, jūs reikia dviejų failų: CSS failas ir „JavaScript“ failas. Jie abu yra supakuoti redaguotos versijos išsaugoti kelis KB puslapius.

Kiekvienas kaskados elementas suskirstomas į atskiras dalis animuoti individualiai per elementus. Sitie yra dinamiškai, todėl nereikia nieko keisti savo HTML.

Bet jums reikės sukurti srautas () funkcija į failą, nukreipę į bet kurį elementą, kurį norite animuoti.

Jūs iš tikrųjų galite naudoti jQuery su šia biblioteka, jei norite, tačiau tai yra nereikalaujama. Taigi, jei pageidaujate pasirinkti elementus su „jQuery“, naudokite jį.

Štai a vanilės „JavaScript“ fragmentas iš pagrindinės svetainės demonstracijos:

Jūs galite pereiti srautas () elementas jokių parametrų, arba galite sukonfigūruokite juos visus patys. Užtrunka aštuoni pasirinktiniai parametrai redaguoti animacijos stilių, laiką, trukmę ir pasirinktines CSS klases.

CascadeJS turi kitą funkciją, vadinamą fragmentas () tai leidžia jums suskaidytos raidės (arba elementai) į atskiras talpyklas, neskelbiant jų. Šią funkciją galite naudoti spalvos ir restyle tekstas puslapyje, nukreipiant kiekvieną atskirą raidę žodžiais. Gana kietas, tiesa?

Viskas kodo pavyzdžiai yra viešai prieinami pagrindiniame bibliotekos puslapyje, todėl galite kopijuoti / įklijuoti ir tinkinti. Bet taip pat rasite dokumentacija „GitHub“ puslapyje, jei ieškote aiškesnio būdo pradėti.