Vereenvoudigde concepten in de naamgeving van webanimaties

Native ondersteuning voor webanimaties werd voor het eerst geleverd in Chrome 36 en is bijgewerkt met afspeelbediening in Chrome 39 . De Element.animate() methode kan worden gebruikt om imperatieve animaties rechtstreeks vanuit JavaScript te activeren, en het geretourneerde object kan worden gebruikt om het afspelen van deze animaties te regelen. Deze methoden worden gedetailleerd beschreven in het huidige concept van de Web Animations W3C-specificatie .

Er is een geleverde polyfill die in actieve ontwikkeling is en die alle webanimatiefuncties bijhoudt die native zijn geïmplementeerd en die in alle moderne browsers wordt ondersteund. Deze kernmethoden zijn nu klaar voor gebruik en verdienen het om deel uit te maken van uw toolbox voor het bouwen van rijke ervaringen die profiteren van animaties (zoals voor de Google I/O 2015-webapp .

Constructor- en groepenwijzigingen

De Web Animations-specificatie beschrijft ook groepen en reeksen , en constructors voor animaties en spelers. Deze zijn beschikbaar in de web-animations-next polyfill, die is ontworpen om functies te laten zien waarover nog discussie bestaat en die nog native moeten worden geïmplementeerd. Als reactie op feedback van ontwikkelaars heeft het team dat webanimaties ontwikkelt de naam van deze functies gewijzigd, zodat deze meer voor zichzelf spreken.

De FXTF kwam onlangs bijeen in Sydney, Australië, en besprak de naamgeving , omdat een aantal ontwikkelaars geldige punten naar voren brachten over het feit dat sommige namen verwarrend waren. Als gevolg hiervan werden de volgende naamswijzigingen overeengekomen:

  • Animatie wordt KeyframeEffect
  • AnimationSequence wordt SequenceEffect
  • AnimationGroup wordt GroupEffect
  • AnimationPlayer wordt Animatie

Houd er rekening mee dat hoewel animaties en hun spelers native beschikbaar zijn in Chrome en als onderdeel van de polyfill, ze momenteel rechtstreeks worden gemaakt via de Element.animate() -methode. Bestaande code die de methode Element.animate() gebruikt, vereist geen wijzigingen.

De nieuwe namen geven nauwkeuriger het gedrag weer dat door elk object wordt geboden. KeyframeEffect beschrijft bijvoorbeeld op sleutelframes gebaseerde effecten die zich op HTML-elementen kunnen richten. Het nieuwe Animation vertegenwoordigt daarentegen een animatie in een van de vele statussen (zoals afspelen, pauzeren, enz.).

BronCodeEffect

Als u delen van de conceptspecificatie gebruikt via de web-animations-next polyfill, moet u uw code binnen de beëindigingsperiode bijwerken om deze nieuwe namen weer te geven. Volgens het beleid voor polyfill-wijzigingen streven we ernaar een oude versie drie maanden te ondersteunen en consolewaarschuwingsverklaringen te geven als uw site verouderde functies of namen gebruikt.

Als je deze functies graag wilt uitproberen, kijk dan uit naar de v2-release van de polyfill om van deze nieuwe namen te profiteren. Zorg er ten slotte voor dat u zich abonneert op de webanimaties-wijzigingengroep om op de hoogte te blijven van eventuele andere wijzigingen.