GreenSock er et JavaScript-rammeverk som gjør det enkelt å animere HTML-elementer. I GreenSock Animation Platform: Første trinn, vil du ta dine første skritt i å lære hvordan du bruker denne kraftige rammen.
Ved å følge dette kurset lærer du hvordan du animerer og kontrollerer DOM-elementer ved hjelp av det kraftige GreenSock-biblioteket. Envato Tuts + instruktør Craig Campbell tar deg gjennom en rekke teknikker, som starter med grunnleggende animasjoner og deretter går videre til mer komplekse som involverer flere objekter. Til slutt lager du en animert meny.
Så lenge du har en forståelse av HTML og CSS, sammen med en grunnleggende kunnskap om JavaScript, vil du være utstyrt med alt du trenger å følge med.
Her er noen gratis leksjoner fra dette kurset, som en forhåndsvisning av hva du kan forvente:
I "TweenLite" bruker en "til" animasjon målelementets nåværende egenskaper som utgangspunkt for animasjonen. I denne leksjonen lærer du syntaksen for å skape enkel bevegelse. Kurset bruker CodePen til å gi koden for hver leksjon, så du vil kanskje se Starter Pen for denne leksjonen..
Easing lar deg tilpasse hastigheten på en animasjon for å gjøre det ser mer realistisk ut. I denne leksjonen lærer du hvordan du bruker grunnleggende lettelse til dine tweens. Igjen, her er Startpennen.
Det første kapitlet i kurset dekker grunnleggende animasjoner, og i denne leksjonen vil du begynne å takle mer komplekse animasjoner som involverer flere objekter. Her er Startpennen for denne.
Du kan ta vårt nye kurs med en gang med et abonnement på Envato Elements. For en enkelt månedlig avgift får du tilgang ikke bare til dette kurset, men også til vårt voksende bibliotek med over 1000 videokurser og bransjeledende e-bøker på Envato Tuts+.
I tillegg får du ubegrensede nedlastinger fra det store Envato Elements-biblioteket med 200.000 + bilder og 26.000 + designmateriell og maler. Lag med unike skrifttyper, bilder, grafikk og maler, og lever bedre bedre prosjekter raskere.
Eller, hvis du ikke er klar til å lære animasjonsteknikker akkurat nå, kan du kanskje lete etter noen forhåndsdefinerte CSS-animasjoner for å inkludere i prosjektene dine.