Animationen mit der Bibliothek Animate.css 12.10.2022, 10:28 Uhr

Animationen leichtgemacht

Die Integration und Implementierung von Animationen ist auf viele verschiedene Arten möglich, zum Beispiel mit der Bibliothek Animate.css.
(Quelle: Shutterstock)
Es gibt mittlerweile zahlreiche Frameworks und Bibliotheken für Animationen. Entweder über JavaScript beziehungsweise TypeScript oder direkt mittels CSS. Letztere Möglichkeit wurde in den vergangenen Jahren immer weiter aufgebohrt. Die aktuellen CSS-Versionen bieten immer ausgefeilte Möglichkeiten für Animationen an, die von modernen Web-Browsern immer besser unterstützt werden. Auch die Performance ist stetig besser geworden, was weitere Möglichkeiten für den Einsatz von Animationen eröffnet.
Mit CSS-Animationen, einem vorgeschlagenen Modul für CSS, wird die Animation von HTML-Dokumenten direkt über CSS vorgeschlagen. Die erste Version des Entwurfs gab es bereits im März 2009 und die aktuelle Version des W3C Working Drafts wurde im Oktober 2018 veröffentlicht. Durch die Integration von Animationen in CSS steht dieses Feature auf modernen Websites praktisch ohne weitere Abhängigkeiten zur Verfügung. Die einzige konkrete Abhängigkeit ist ein moderner Browser, der mit den neuen CSS-Funktionen umgehen können muss. Der Fokus in diesem Artikel liegt auf CSS-Animationen und Websites. Etwas JavaScript wird in den Beispielen ebenfalls dazu gemischt, aber der Fokus auf Websites und CSS bleibt bestehen. Zudem behandelt der Artikel CSS-Animationen ohne weitere Rücksicht auf Web-Frameworks oder andere Komponenten-Bibliotheken.

web & mobile DEVELOPER

Sie wollen zukünftig auch von den Vorteilen eines plus-Abos profitieren? Werden Sie jetzt web&mobile Developer plus Kunde.
  • 2 Monate Gratis testen
  • Über 4.000 qualifizierte Fachartikel
  • Diverse DevBooks thematisch für Sie zusammen gestellt
  • Webcasts von 30 - 90 Min.
  • Aufzeichnungen von ausgewählten Fortbildungen und Konferenzen
  • Auf jedem Gerät verfügbar