Natywna obsługa animacji internetowych została po raz pierwszy udostępniona w Chrome 36, a w Chrome 39 została zaktualizowana o sterowanie odtwarzaniem. Metody Element.animate()
można używać do uruchamiania imperatywnych animacji bezpośrednio z JavaScriptu, a zwrócony przez nią obiekt można wykorzystać do sterowania odtwarzaniem tych animacji. Te metody są opisane w obecnej wersji roboczej specyfikacji W3C dotyczącej animacji internetowych.
W trakcie aktywnego rozwoju jest dołączona implementacja zastępcza, która śledzi wszystkie funkcje animacji internetowych zaimplementowane natywnie i jest obsługiwana we wszystkich nowoczesnych przeglądarkach. Te podstawowe metody są już gotowe do użycia i zasługują na miejsce w Twoim zestawie narzędzi do tworzenia bogatych aplikacji, które korzystają z animacji (np. aplikacji internetowej Google I/O 2015).
Zmiany w konstruktorze i grupach
Specyfikacja animacji internetowych zawiera też opis grup i sekwencji oraz konstruktorów animacji i odtwarzaczy. Są one dostępne w polyfillu web-animations-next, który został opracowany w celu zaprezentowania funkcji, które są jeszcze w trakcie dyskusji i jeszcze nie zostały zaimplementowane natywnie. W odpowiedzi na opinie deweloperów zespół zajmujący się animacjami w internecie zmienia nazwy tych funkcji, aby były bardziej zrozumiałe.
FXTF spotkało się niedawno w Sydney w Australii, aby omówić nazwy, ponieważ wielu deweloperów zgłosiło uzasadnione zastrzeżenia dotyczące ich mylącego charakteru. W związku z tym uzgodniliśmy wprowadzenie tych zmian w nazwach:
- Animation staje się KeyframeEffect
- AnimationSequence staje się SequenceEffect
- AnimationGroup staje się GroupEffect.
- AnimationPlayer staje się Animation.
Pamiętaj, że chociaż animacje i odtwarzacze są dostępne natywnie w Chrome i jako część polyfilla, są one obecnie tworzone bezpośrednio za pomocą metody Element.animate()
. Dotychczasowy kod, który używa metody Element.animate()
, nie wymaga żadnych zmian.
Nowe nazwy dokładniej odzwierciedlają działanie każdego obiektu. Na przykład KeyframeEffect
opisuje efekty oparte na klatkach kluczowych, które mogą być kierowane na elementy HTML. Nowy obiekt Animation
reprezentuje natomiast animację w jednym z wielu stanów (np. odtwarzanie, wstrzymanie itp.).
SourceCodeEffect
Jeśli używasz części specyfikacji roboczej za pomocą biblioteki polyfill web-animations-next, musisz zaktualizować kod w okresie wycofywania, aby uwzględnić nowe nazwy. Zgodnie z zasadami dotyczącymi zmian w polyfillach staramy się obsługiwać starszą wersję przez 3 miesiące i wyświetlać ostrzeżenia w Konsoli, jeśli Twoja witryna używa przestarzałych funkcji lub nazw.
Jeśli chcesz wypróbować te funkcje, czekaj na wersję 2 biblioteki polyfill, aby korzystać z tych nowych nazw. Na koniec zasubskrybuj grupę web-animations-changes, aby otrzymywać informacje o innych zmianach.