Velkendt Flash animation platform er nu tilgængelig for web
Dato: 25-09-2015
Dem der nogensinde har rodet med Flash, husker formentlig Greensock - et stort bibliotek med en masse nyttige funktioner for animation. Flash's tid er forbi, idag bruger man mere og mere javascript og CSS for at skabe liv på hjemmesider. Greensock v12 (eller Greensock Animation Platform, GSAP) er nu tilgængelig for Javascript.
Greensock giver en mulighed for at manipulere med enhver HTML objekt, der befinder sig på websiden. Der findes snesevis af måder at animere objektet på. Derudover, kan man opnå endnu bedre resultat ved at kombinere flere animationer i en "timeline", gentage animationen, vende den om eller afspille filmen når brugeren gør noget aktivt. Det et er virkelig imponerende hvor nemt det er at skrive Greensock scripts. Normalt skal man kun operere med en starttilstand og en sluttilstand af objektet, så skal der angives hvilken type animation skal anvendes. Følgende script flytter et objekt til den nye position og gør det delvist gennemsigtigt:
TweenMax.to(myObject, 2, {x:100, y:200, alpha: 0.5});
Vi har for nyligt stået over for et valg om hvilket animation framework i vores nyt projekt. Og det har vist sig, at Greensock blev til det rigtige valg fordi:
- Fremragende performance (se testen)
- Et virkeligt rigt funktionelt bibliotek. Der findes bl.a. avancerede funktioner, som gør den valgte animationstype glat og sexet. Muligheden for at transformere et objekt omkring et givet punkt. Som også kan animeres.
- Understøttes af IE6 og nyere.
- Biblioteket er uafhængigt af andre biblioteker, og ikke desto mindre er kompatibel med jQuery.
- Næsten samme syntakse anvendes i Javascript, AS2 og AS3 ufgaver.
- Den minimale udgave fylder kun 7Kb.
- Der anvendes "timeline" konceptet, som betyder, at animationerne kan kædes sammen, efter kæden er afsluttet, kan næste animation køre. Der kan skrues op og ned på hastigheden, animationerne kan sættes på pause eller vendes om.
- Stort set alle HTML egenskaber kan animeres.
- Biblioteket er godt dokumenteret.
Klik her for at se vores implementation af et tidsregistreringssystem, som er bl.a baseret på Greensock Animation Platform.