75 Web-animaatiotyökaluja sinun täytyy kokeilla
Animaatio on yksi niistä trendeistä, jotka ovat saaneet kynsinsä web-rajapintoihin. Sen suosio vaihtelee, mutta se on aina jossain, olennaisena osana millä tahansa verkkosivustolla.
Pienistä, tuskin näkyvissä olevista latauskierteistä koko sivun siirtymiin, kuten elokuvakokemukseen, animaatio ulottuu jokaiseen alueeseen malleistamme.
Suunnittelijoille, jotka haluavat sisällyttää animaatiota, tarjolla on runsaasti vaihtoehtoja. Meidän kokoelmamme kattaa työkalut, joiden avulla voit luoda eri asteikkojen animaatioita ja eri tarkoituksia varten puhtaasti koristeellisista siirtymistä, jotka vain rajata rajapinnat ja käyttäjäkokemuksia parantaviin mielekkeviin vaikutuksiin. Tässä on 75 lisäosaa ja kirjastoa, jotka haluat tarkistaa. et käytä niitä kaikkialla joka kerta, mutta jokaisella on ihanteellinen käyttötarkoitus, ja jotkut käyttävät sitä uudestaan ja uudestaan ...
1. Animate.css
Animate.css on peruskirjasto, jossa on runsaasti ristiselain-animaatioita, jotka ovat monien ratkaisujen taustalla. Klassisista ponnisteluista ja hauista modernisiin käänteisiin ja ainutlaatuisiin vaikutuksiin se pystyy vastaamaan lähes kaikkien projektien tarpeisiin.
2. Magic-animaatiot
Magic-animaatiot keskittyy poikkeuksellisiin vaikutuksiin, jotka antavat rajapinnalle erityisen rauha. Vaikka kirjasto ei voi ylpeillä valtavasti monimuotoisuutta, riittää rikastuttaa käyttökokemusta.
3. Bounce.js
Bounce.js on pieni leikkikenttä, jossa voit kokeilla CSS-pohjaisia animaatioita. Lisää vain komponentti ja säädä asetukset, jotta kaikki elää. Lopuksi viedään css-tiedosto.
4. AnijS
AnijS auttaa animaation käsittelyssä intuitiivisella tavalla käyttämällä yksinkertaisia ohjeita, kuten If, On, Do, To. Suuri asia on, että olet tervetullut käyttämään omia luokkasi tai jopa Animate.css (aiemmin mainittu) luoda jotain mahtavaa.
5. Snabbt.js
Snabbt.js on kuuluisa minimaalisesta lähestymistavastaan, joka tuottaa nopeita animaatioita. Se painaa vain 5 kt; kuitenkin se pystyy antamaan minkä tahansa komponentin näkyväksi voimaksi kääntämällä, pyörittämällä, vinoutumalla, skaalaamalla tai muuttaen sen muotoa.
6. Kute.js
Kute.js on erinomainen suorituskyky, joka on ankaran animaation moottori. Se on nopea ja yhteensopiva eri selainten ansiosta vanhojen selainten käsittelemien elinkelpoisten varojen ansiosta. Mukana on lukuisia laajennuksia, jotka tarjoavat tehokkaan työympäristön.
7. Velocity.js
Velocity.js on animaation moottori, joka ensi silmäyksellä voi näyttää edustavalta. Kuitenkin sen arsenal sisältää kaikki säännölliset animaation tyypit, kuten morphing, silmukka, helpottaa, vieritys jne. Se on nopea ja jQuery riippumaton.
8. Lazy Line Painter
SVG-polun animaatioita helpotetaan Lazy Line Painter . Ota piirustustasi Illustratorilta SVG-muodossa ja lähetä se muuntimeen. Jälkimmäinen luo jQuery-tiedoston, joka käsittelee animaatioprosessia. Jos se on tarpeen, voit tehdä muutoksia oikein koodin sisällä.
9. SVG.js
SVG.js tarjoaa intuitiivisen ympäristön, jossa voit manipuloida ja animoida SVG: itä. Se on pieni ja itsenäinen puhtaalla syntaksilla ja yhtenäisellä API: lla. Tee mitä haluat: animoida koko, väri, sijainti, tekstipolkuja; muuntavat komponentit; sitovat tapahtumat jne.
10. Liike-käyttöliittymä
Toisin kuin edelliset esimerkit, Liike-käyttöliittymä hyödyntää SASS: n luoda kiehtovia CSS-animaatioita. On olemassa joukko ennalta määritettyjä siirtymiä ja tehosteita, joita voidaan soveltaa mihin tahansa HTML-komponenttiin. Kaikki toimii kaikissa suosituissa selaimissa paitsi IE9: ssa.
11. Odota! elävöittää
Odota! elävöittää voit tehdä viivytyksiä ja odottaa animaatioita yksinkertaisella tavalla. Laske kaikki tarvittavat aikavälit pienen paneelin läpi ja luo luonnollinen animaatio ilman hälinästä.
12. Dynamics.js
Dynamics.js on JavaScript-powered kirjasto, joka tarjoaa 9 normaalia tehoa pelata. Voit määrittää kestoa, taajuutta, kitkaa, ennakoinnin kokoa ja ennakoivaa voimaa saavuttaaksesi todellisia fysiikan perustuvia animaatioita.
13. Koreografi.js
Kanssa Choreographer.js sormenpäilläsi ei pidä pelätä monimutkaisia animaatioita, koska tämä JavaScript-kirjasto tekee kaiken raskaan nostamisen. Vaikka se käsittelee rajoitetun määrän animaatioita, se mahdollistaa myös mukautettujen toimintojen tekemisen, jotta voit luoda omia mestariteoksia.
14. Anime.js
Tuloksena on vaikuttava joukko ominaisuuksia, jotka mahdollistavat useiden animaatioiden ketjuttamisen, eri tapahtumien synkronoinnin, piirustuslinjat, morphointiobjektit, yksittäisten animaatioiden rakentamisen jne. JavaScript-animaation moottori yllättää sinut sen mahdollisuuksista.
15. Mo.js
Mo.js tarkoittaa Web-liikkeitä. Se on uskomattoman nopea ja samalla intuitiivinen ja yksinkertainen. Luo houkuttelevia polkuja, odottamattomia vuoropuhelu modaalisia siirtymiä, kupla-asettelua, räjähtäviä animaatioita ja paljon muuta.
16. Sequence.js
Sequence.js on CSS-pohjainen kehys reagoivan kosketusnäytön mahdollistavien vaiheittaisten animaatioiden rakentamiseen. Se on ihanteellinen luomaan liukusäätimiä, esityksiä, bannereita ja muita dynaamisia osia. Monista premium-suunnitelmista löydät ilmaisen, joka antaa sinulle henkilökohtaisen avoimen lähdekoodin.
17. Shifty
epäluotettava on kytkeä moottori, jossa keskitytään voimakkaasti optimointiin, nopeaan suorituskykyyn, joustavuuteen ja laajentamiseen. Sen katsotaan olevan toteuttamiskelpoinen vaihtoehto GreenSockille, mutta siinä on paljon yksinkertaisempi käyttöliittymä.
18. Se on tiistai
tiistai on erillinen animaatiokirjasto, jota voidaan käyttää yhdessä muiden kirjastojen kanssa. Se tekee sisäänkäynnit ja uloskäynnit näyttävät sileältä, hienovaraiselta ja tyylikkäältä. Se tarjoaa erilaisia vakioefektejä, kuten fade-ins, expand-ins, shrink-ins, drop-ins jne.
19. CSS Animate
CSS Animate on alkeellinen leikkipaikka, joka luo pätevän ja häiritsemättömän koodin mille tahansa säännölliselle animaatiolle. Aseta nimi, luokka, animaatioominaisuudet, kehysominaisuudet; manipuloida aikajanaa ja lisätä merkkejä: yhdellä sanalla säädä kaikki, mitä tarvitset tuottamaan säännöllistä avainympäristöön perustuvaa animaatiota.
20. Vivus.js
Toimitus kolmella animaatiotyypillä: viivästys, synkronointi ja paljastaminen yksitellen, Vivus.js piirtää SVG: n sileällä ja luonnollisella tavalla, jolloin komponentin syntyminen on hieno kokemus. Voit mennä ennalta määriteltyihin animaatioihin tai käyttää omia mukautettuja toimintoja.
21. Bonsai.js
Bonsai.js on JavaScript-kirjasto kehittyneisiin grafiikan manipulointeihin. Siinä on melko yksinkertainen API- ja SVG-renderoija. Käytä sen online-editoriä antamaan testausasema, tutustumaan syntaksiin ja jopa lataamaan joitakin näytteitä aloittaaksesi.
22. GreenSockin GSAP
GSAP on tehokas animaatioalusta, joka on suunnattu ammattimaisille animaatioille. Se on lukuisia laajennuksia ja apuohjelmia, jotka vastaavat erilaisista animaatioista. Se koostuu BezierPlugin, CSSPlugin, DrawSVGPlugin, MorphSVGPlugin, Physics2DPlugin, TweenLite jne.
23. Popmotiikka
Popmotion on toinen kevyt ja kätevä vaihtoehto Greensockille kokoelmissamme. Se on liikkeessä oleva moottori, jolla on täydellinen ohjaus kuhunkin kehykseen. Se on edistyksellinen sekoitus, värien sekoitus ja joukko toimintoja ja toimia monimutkaisten ratkaisujen rakentamiseen.
24. Tween.js
Paljon uskomattomia juttuja tehdään apuna Tween.js . Se on huipputekniikka tweening-moottori, jossa on lukuisia parametreja animaation hallitsemiseksi. Se on myös erinomainen ratkaisu Three.js: n ohjaamien hankkeiden tehostamiseen.
25. Hover.css
Hover.css 'kirjasto voidaan jakaa useisiin perusluokkiin: 2D-siirtymät, tausta-siirtymät, kuvamallinnut, rajaviivat, varjo- ja hehkuvuorot, puhekuplat ja kiharat. Käytä näitä vaikutuksia mihin tahansa suunnittelun osaan ilman rajoituksia.
26. Transit
Luettelo transit on melko lyhyt, mutta se sisältää tärkeimmät tavarat rakennettaessa 2D- ja 3D-muunnoksia. Voit esimerkiksi määrittää viiveitä ja kestoja, lisätä lieventotoimintoa, käyttää suhteellisia arvoja ja paljon muuta.
27. Raketti
Raketti on ratkaisu kohteen objektin liikuttamiseksi yhdestä pisteestä toiseen. On 8 erikoisvaikutusta, kuten pulssia tai pyörimistä, jotka antavat tämän matkan ihanan sekaan .
28. Animo.js
Animo.js on suhteellisen pieni työkalu siirtymien ja animaatioiden käsittelemiseen. Siinä on joukko ylimääräisiä lisäosia kuten laskenta-aika, kiertäminen ja animaatio, joka rikastuttaa kirjastoa ja helpottaa halutun vaikutuksen saavuttamista.
29. Shift.css
Shift.css on kehys rakentaa animaatioita säiliöön, joka vaikuttaa sekä sisäkkäisiin että mukautuvaan elementtiin. On olemassa 15 tyyppistä vakiomallinnusta, mukaan lukien siirrettävät, sisään tulevat, poistumiset, pudottaminen ja jotkut muut.
30. CSShake
CSShake mukana on 11 luokkaa, jotka pakottavat DOM: n elementit ravistelemaan. Voit valita suuntaan (vaakasuoraan tai pystysuoraan), kirjoita (kiinteä, hullu, vakio, palo), intensiteetti (hidas tai kova) tai vain oletusasetus.
31. Saffron
Jos haluat käyttää sekoittimia, jotta voit helposti ja nopeasti manipuloida animaatioita ja siirtymiä sitten Sahrami on varmasti sinulle. Se on kokoelma uudelleenkäytettäviä menetelmiä, jotka on kirjoitettu Sass, jossa voit asettaa muuttujat ja parametrit.
32. CSSynth
CSSynth on pieni editori, jossa voit nauttia synkronoinnin kauneudesta. Animaatio perustuu eri neliöihin, joiden määrä voit määrittää vasemmalla paneelilla. Valitse tehoste, määritä viive ja valitse, haluatko ladata tuloskoodin CSS- tai SCSS-muodossa.
33. Ceaser
ceaser on vanha, aika todistettu työkalu kokeiden tekemiseen klassisen helpotuksen animaation kanssa. On olemassa useita muunnoksia, jotka alkavat lineaarisista ja päättyy räätälöityyn. Kaksi lisäparametria (kesto ja teho) auttavat tuloksen täydentämisessä.
34. Morf.js
Jos haluat ottaa edellä mainitun työkalun hieman eteenpäin, voit yrittää Morf.js . Se tarjoaa siirtymiä, jotka perustuvat mukautettuihin helpotustoimintoihin. Lähes 40 ennalta määriteltyä vaihtoehtoa voidaan nopeasti sopeutua projektiin.
35. Voxel.css
Voxel.css on luotu erityisesti 3D-renderointiin. Sen yksinkertainen toteutus mahdollistaa jopa aloittelijoille pääsyn käsiksi 3D CSS: stä. Kirjastossa on neljä tärkeää luokkaa: Scene, World, Editor ja Voxel, jotka auttavat rakentamaan pelejä ja nauttimaan toiminnasta.
36. Repaintless.css
Repaintless.css käyttää FLIP-tekniikkaa animaation tekemiseen nopeasti ja sileästi. Vaikkakin se edellyttää parannuksia. kuitenkin se on täydellinen aloitus niille, jotka kiinnittävät erityistä huomiota suorituskykyyn.
37. MixItUp
Sekoita on kirjasto, joka suodattaa, lajittelee, liittää ja muut tärkeät toiminnot, jotka liittyvät enemmistörajapintoihin, kuten salkkuihin, gallerioihin jne. Se on riippuvuusvapaa ja lupaa tarjota korkean suorituskyvyn.
38. Wallop
Kuten otsikon mukaan, Tälli on osoittaa ja piilottaa asioita miellyttävällä tavalla; ennustettavasti, sen yleinen käyttö on rakennusliukusäätimien rakentaminen. Kukaan ei kuitenkaan estä sinua käyttämästä sen potentiaalia ja luomaan jotain mielenkiintoista ja kiehtovaa.
39. Ramjet
Patoputki- muuttaa yhden elementin toiseen liikkumisfunktion avulla aikaansaadun liikkeen illuusion avulla. Se pystyy työskentelemään DOM-elementtien, SVG: iden, staattisten kuvien tai animoitujen kuvien kanssa.
40. jQuery DrawSVG
Tehokkaan jQuery-animaation moottorin ansiosta se vetää tehokkaasti kaikki polut SVG: ssä antaen kuva dramaattiselle ja samalla tyylikkäälle sisäänkäynnille. Menettely on yksinkertainen: lisää plugin sivulle, alusta se ja suorita animaatio.
41. Animatic.js
Animatic.js on loistava ristiselainratkaisu, jossa on integroituneet fysiikan säännöt, joissa käytetään CSS-muunnoksia, 3D-muunnoksia ja JavaScript-toimintoja. Sen päätehtävänä on vähentää ponnistelujasi useiden esineiden antamiseksi kerralla. Voit rakentaa sekä rinnakkaisia että peräkkäisiä animaatioita, jotka säätävät tarkasti kestoa, viivettä ja helpotusta.
42. Move.js
Move.js on yksinkertaistettu työkalu säännöllisten animaatioiden luomiseen, kuten skaalaukseen, vinoutumiseen, liikuttamiseen tai kääntämiseen. Jokainen animaatio voidaan parantaa klassisella helppokäyttöisyydellä.
43. Eg.js
Eg.js on huolellisesti kokoonpantu kokoelma erilaisia vaikutuksia ja dynaamisia elementtejä, joiden tarkoituksena on parantaa rajapintojen vuorovaikutusta. On olemassa 8 voimakasta komponenttia, jotka määrittelevät perustehtävät ja 6 päätapaa ja tapahtumaa muuhun tarkoitukseen.
44. GFX
GFX on vaikuttava 3D-animaatiokirjasto CSS3-animaatioiden rakentamiselle ohjelmallisesti. Se toimii jQueryn kanssa, joten halutun tuloksen tuottaminen on helpompaa. Voit leikata skaalaamalla, pyörimällä, kääntämällä, vinoutumalla ja muilla tavoilla.
45. Stylie
Vaikka sanotaankin Stylie on työkalu hauskaa, mutta se varmasti vaikutuksen sinut sen ominaisuuksia. Ohjauskeskuksessa on neljä välilehteä, joiden avulla voit korjata avainkehyksiä, helpottaa, viedä valintoja ja HTML-muotoja, jolloin monimutkaiset animaatiot ovat helppokäyttöisiä.
46. Iconate.js
Iconate.js injektoi elämän kuvakkeiden muunnoksiin, mikä lisää kahden kohteen välistä siirtymistä miellyttävän mukanaolevalla vaikutuksella. Se toimii hyvin paitsi Font Awesome, mutta myös Glyphicons ja jopa omia räätälöityjä kuvakkeita.
47. AnimateMate
AnimateMate on pieni työkalu pienimuotoisten animaatioiden tuottamiseen ja viemiseen Sketch-ympäristöstä. Se ei ole jotain mielikuvitusta, mutta sen avulla voit pelata avainkehyksillä, lisätä helpottavia toimintoja, hallita sekvenssejä ja muuta.
48. CAAT
CAAT (joka on Canvas Advanced Animation Toolkit) on pörssirakenteinen kehys, joka muodostaa tehokkaan tandem-toiminnon JavaScriptin kanssa. Sen työkalupakettiin kuuluvat kohtaukset, monitulostusteknologiat, leikkausnaamarit, vakiomallitäyttelyt jne.
49. Granim.js
Granim.js on pieni JavaScript-kirjasto, joka tukee vuorovaikutteisten gradienttipohjaisten keskikappaleiden rajapintoja. Se voi olla tavallinen radiaalinen gradientin animaatio, dynaamiset gradientit, joita käytetään kuvan taustalla tai liikkuvat gradientit yhdistettynä kuvamaskeihin.
50. Animista
Tekijä: Ana Travas, Animista on leikkipaikka kokeiden suorittamiseen joukolla perinteisiä ja harvinaisia ennalta määritettyjä CSS-pohjaisia animaatioita. Valitse kesto, ajoitustoiminto, viive, iterointilaskenta ja muutamia muita vaihtoehtoja tuloksen tarkastelemiseksi.
51. Obnoxious.css
Obnoxious.css mukana on 5 ainutlaatuista CSS-pohjaista animaatiota, jotka pakottavat käyttöliittymän elementit ravistelemaan, kierrättämään, suurentamaan, jäljittelemään strobe-vaikutusta tai vaihtamaan kirjasimen painoa. Sinun tarvitsee vain valita haluamasi luokka haluttuun divaan.
52. Animatelo
Animatelo sisältää useita silmiinpistäviä dynaamisia vaikutuksia, jotka on lainattu kuuluisasta ja tehokkaasta Animate.css: stä, mikä helpottaa niiden soveltamista. Web-animaatioiden API-polyfillin ansiosta kaikki nykyaikaiset selaimet tukevat sitä.
53. Foxholder
Foxholder on paketti, jossa on 15 hienoa, pienikokoista efektiä, jotka on luotu erityisesti parantamaan käyttäjän vuorovaikutusta lomakkeella. Jokainen menetelmä korostaa syöttökenttää omalla tavallaan: se voi tehdä rajan kirkkaammaksi, lisätä visuaalisia vihjeitä, asettaa liikkeelle tekstiä ja paljon muuta.
54. Rhythm.js
Rhythm.js on kyse leikkisästä disko-inspiroiduista pienistä animaatioista. Tämä JavaScript-kirjasto sisältää vaikutuksia, jotka jäljittelevät jonkinlaista tanssimuutosta. On olemassa lähes 20 vaihtoehtoa, jotka lisäävät boogie-woogia sivustoosi.
55. Colorido.js
Paljon kuin Granim.js, tämä JavaScript-powered plugin on luotu manipuloimaan väriominaisuutta. Se auttaa dynaamisesti vaihtamaan taustan ja tekstin sävyjä ja peittävyyttä sekä luomaan ei-staattisia säteittäisiä, lineaarisia, lävistäviä ja vaakasuuntaisia kaltevuuksia.
56. Barba.js
Barba.js hyödyntää PJAX-tekniikkaa (ajax-tekniikkaa), jolla helpotetaan käyttäjien ns. kova refresh -vaihtoehtoja sivujen välillä. Se vain piilottaa vanhan kontin ja näyttää uuden kontin hienovaraisella silmämuotoisella tavalla.
57. ScrollReveal.js
ScrollReveal.js on suosittu työkalu animaatioiden luomiseen. Sen tärkein paljastaa () menetelmä voit hallita erilaisia animaatioita ja valvoa kaikkia niiden standardi näkökohdat. Hyvä asia on se, että se toimii hyvin sekä web- että mobiiliselaimissa.
58. Scrollanim
Scrollanim on vähemmän kehittyneempi mutta kätevämpi ja yksinkertaisempi työkalu käytettäväksi aikaisemman esimerkin sijaan. Vaikka se suosii CSS3: ta, mutta sen avulla voit lisätä animaatioita JavaScript API: n avulla tuottamaan vieritys-laukaisut animaatioita. Siinä on useita valmiiksi muotoiltuja ratkaisuja, joita voit nopeasti ottaa käyttöön projektillesi.
59. ScrollTrigger
Vaikka edelliset kaksi ratkaisua keskittyvät pääasiassa perinteiseen vertikaaliseen vieritykseen, Tämä on rakentaa pitkiä horisontaalisia verkkosivustoja. Sen avulla voit luoda dynaamisia liitäntöjä x-akselilla, jossa on kauniita CSS3-animaatioita melko alkeellisen syntaksin avulla.
60. Force.js
Force.js on pieni ratkaisu, jolla ei ole valtavaa toiminnallisuutta ja rikkautta vaihtoehtoja. Se on kuitenkin ihanteellinen säännöllisiin tehtäviin, kuten esineiden asettamiseen hienovaraiseksi liikkeeksi tai hienosäätöön. Kuten tavallista, helpotus on sen ytimen animaation puhdas ja siisti.
61. AOS
AOS tarkoittaa animaatiota vierittämällä. Se tekee sen, mitä se sanoo - antaa sinulle joukon vilkkaita ennalta määritettyjä efektejä, jotka laukaisevat vieritystapahtumasta. Jos haluat jakaa osiin dramaattisen sisäänkäynnin ilman kaivamista syvälle koodiin, niin se on varmasti sinulle.
62. Rellax
Rellax on kaunis parallaksi. Se on vaalea vaniljan JavaScript-kirjasto, joka antaa hienovaraisen kosketuksen 3D-ulottuvuuteen rajapinnoille.
63. Tilt.js
Tilt.js tuottaa mielenkiintoista parallaksikäyttöistä kallistusvaikutusta. Se siirtää objekteja kaltevaan asemaan, joka jäljittelee 3D: ää perus-2D-tasossa. Voit korjata akselin, mikä tekee vaikutuksesta houkuttelevamman ja mielenkiintoisemman, tai luo jonkinlaisen häikäisyn tai kelluvan tunteen.
64. Transform-kun
Muunnosperustaisesta kun on erinomainen ratkaisu malleihin, joissa on paljon suorituskykyä ja natiivitukea. Se vetoaa kahteen tärkeään parametriin: aika- ja vieritystoimintoon, jolloin käyttäjän seikkailu käyttäjän ohjaamana käyttöliittymän kautta valvoo sinua. Se toimii sekä SVG: n että tavallisten HTML-elementtien kanssa.
65. CSS3-animaatio
Tämä on vanhan koulun generaattori, jossa on esikatselukuva perustuvien CSS3-animaatioiden luomiseen. On olemassa vakiokeskus, jossa voit muuttaa siirtymän kestoa, toistojen määrää, ajoitustoimintoja jne. Rutiini on yksinkertainen: aseta kaikki ylös, kopioi tuloksena olevat HTML- ja CSS-koodit ja liitä ne projektiin.
66. Curve.js
Curve.js hengittää elämää linjoiksi, jolloin he "tanssivat" ja pyörivät aivan kuin aalto. Käytä sitä luomaan abstrakteja elegantteja geometrisia inspiroivia taustoja tai keskikappaleita.
67. Animator.js
Animator.js sanotaan olevan joustava, tehokas ja kevyt. Se tarjoaa helpoin tapa hallita avainkehyksiä ja tuottaa eri asteikkojen CSS-animaatioita. Se on myös riippuvuutta vapaa.
68. Cel-animaatio
Cel-animaatio on Sass-mikseri, jonka avulla voit hallita perinteisiä avainkehyksiä. Voit käynnistää SVG: n tai minkä tyyppiset HTML-elementit.
69. Scrollissimo
Scrollismo on luotu toimimaan yhteistyössä Greensockin kanssa taitavasti ja sujuvasti animoimalla esineitä käyttäjän vierittämällä. Mukana lisätyn JavaScript-plugin kosketusnäytön gadgeteilla se kattaa lukuisia laitteita.
70. jqClouds
jqClouds on primitiivinen plugin, joka generoi ja populoi muotoilua, jossa liikkuvat pilvet, jotka liukuvat rajapinnan yli. Voit muuttaa konseptia, korvaamalla pilvet millä tahansa muulla esineellä, jolloin staattinen käyttöliittymä antaa erityisen dynaamisen maun.
71. Värianimaatio
Kuten olet arvannut, tämä työkalu on tausta-, rajaus- tai tekstikentän sävytys ja läpinäkyvyys. Itse asiassa se toimii kaikkien objektien värillä, jolla on omaisuus.
72. Flubber
Jätä pois äkilliset hyppyt ja jyrkkä metamorfoosi, joita voi esiintyä, kun yksi objekti muuntaa toiseen voit käyttää Flubber . Plugin tarjoaa sileät interpolaatiot kahden muodon välillä. Ainoa haittapuoli on se, että se toimii vain 2D-grafiikalla.
73. Particles.js
Jos olet leikkisä hiukkasten animaatio - suosittu valinta nykyään - voit käyttää sitä tämä kätevä generaattori . Se perustuu elinkelpoiseen JavaScript-kirjastoon, joka tekee kaiken työn. Aseta haluamasi asetukset, kuten väri, numero, muoto, koko, peittävyys jne. Ja viedä tulos vain.
74. 3D-linjat animaatio Three.js: lla
Tämä on pieni käsikirjoitus sillä ei ole kaikkia edellä mainittujen lisäosien ominaisuuksia. Kuitenkin se lisää käyttöliittymänne kauniin animoitun taustan täynnä hiukkanen animaatiota. Voit määrittää värin, viivat, läpikuultavuuden ja joitain muita vaihtoehtoja, jotta se sekoittuu ympäristöön.
75. Kolme
Viimeinen mutta ei vähäisin, three.js - tehokas ja monipuolinen kirjasto, joka on lukuisten vaikuttavien sivustojen takana. Se sopii sekä yksinkertaisille että monimutkaisille projekteille. Sen avulla voit työskennellä
