Website Page Transitions mit 2 Zeilen CSS Code
Level:
Einfach 👌
In diesem Webflow Tutorial geht es um das Thema Page Transitions. Page Transitions können einer Webseite ein App-Feeling verleihen und sind einfach zu implementieren. Es wird gezeigt, wie man Cross-document view transitions verwenden kann, die momentan von Chromium Browsern unterstützt werden. Es wird betont, dass CSS-Animationen verwendet werden, um die Page Transitions umzusetzen, und dass die Seite auch ohne Unterstützung der Animationen weiterhin funktioniert. Es wird ein Beispielprojekt gezeigt, bei dem verschiedene Elemente wie Navigation, Bilder und Überschriften animiert werden. Es wird auch gezeigt, dass die Animationen mit CMS-Inhalten funktionieren.
View Transitions Chrome Dokumentation:
https://developer.chrome.com/docs/web-platform/view-transitions
Browser Support:
https://caniuse.com/?search=view-transition