Ein Animationseffekt kann zu jedem Zero Block Element hinzugefügt werden. Es gibt zwei Arten von Animationseffekten: einfache und erweiterte oder Schritt-für-Schritt-Animationen. In diesem Artikel behandeln wir die grundlegendsten Animationseinstellungen.
Zu den grundlegenden Animationsoptionen gehören:
- Animation – verschiedene Optionen für den Start des Animationseffekts;
- Parallaxe – die Einstellungen für den Parallaxeneffekt;
- Fixieren: Die Einstellungen für den Positionierungseffekt wurden festgelegt.
Animation
Zu den Animationseffekten gehören Einblenden, Einblenden rechts, Einblenden links, Einblenden nach oben, Einblenden nach unten und Vergrößern.
Alle Animationseffekte verfügen über eine Reihe gemeinsamer Einstellungen wie Dauer, Verzögerung und Triggerversatz.
Die Dauer ist die Dauer des Animationseffekts in Sekunden. Der numerische Wert ist die Anzahl der Sekunden, in denen der Animationseffekt stattfindet.
Die Verzögerung ist die Verzögerung in Sekunden vor dem Start des Animationseffekts.
Der Trigger-Offset ist der Offset in Pixel vom unteren Rand des Fenster-Containers, an dem die Animation abgespielt wird.
Wenn Sie Animationseffekte mit Elementen verwenden, die von oben, unten, rechts oder links angezeigt werden, bedeutet die Option "Abstand" die Entfernung, die der Block von dem Ort zurücklegt, an dem er zuerst erscheint.
Der Effekt "Vergrößern" verfügt über eine Einstellung "Skalieren". Wenn es auf weniger als 100 % eingestellt ist, zoomt das Element auf seine ursprüngliche Größe. Wenn es auf mehr als 100 % festgelegt ist, wird das Element verkleinert und verkleinert.
Die Dauer ist die Dauer des Animationseffekts in Sekunden. Der numerische Wert ist die Anzahl der Sekunden, in denen der Animationseffekt stattfindet.
Die Verzögerung ist die Verzögerung in Sekunden vor dem Start des Animationseffekts.
Der Trigger-Offset ist der Offset in Pixel vom unteren Rand des Fenster-Containers, an dem die Animation abgespielt wird.
Wenn Sie Animationseffekte mit Elementen verwenden, die von oben, unten, rechts oder links angezeigt werden, bedeutet die Option "Abstand" die Entfernung, die der Block von dem Ort zurücklegt, an dem er zuerst erscheint.
Der Effekt "Vergrößern" verfügt über eine Einstellung "Skalieren". Wenn es auf weniger als 100 % eingestellt ist, zoomt das Element auf seine ursprüngliche Größe. Wenn es auf mehr als 100 % festgelegt ist, wird das Element verkleinert und verkleinert.
Parallaxe
Parallaxenanimationen haben zwei Einstellungen: beim Scrollen und beim Bewegen der Maus.
Parallaxe auf der Schriftrolle
Parallaxe bei Mausbewegung
Suchen Sie in den Einstellungen für Parallax on Scroll die Einstellung Speed. Wenn die Geschwindigkeit weniger als 100 % beträgt, bewegt sich ein Element langsamer als die gescrollte Seite. Wenn die Geschwindigkeit mehr als 100 % beträgt, bewegt sich das Element schneller als die gescrollte Seite.
In den Einstellungen für Parallax on mouse move bedeutet der Abstand entlang der X- und Y-Achse den maximalen Parallax-Neigungseffekt.
In den Einstellungen für Parallax on mouse move bedeutet der Abstand entlang der X- und Y-Achse den maximalen Parallax-Neigungseffekt.
Festsetzung
Beim Einrichten einer Fixierungsanimation können Sie auswählen, wo das Element fixiert werden soll. Dies ist der Bildschirmbereich (oberer, mittlerer oder unterer Bildschirmrand), an dem der Fixiereffekt beginnt. Sie können einen der drei Bereiche auswählen: Fenster oben, Fenstermitte oder Fensterunterseite.
Der Trigger-Offset ist der Punkt, an dem ein Element relativ zur Fensteroberseite, Fenstermitte oder Fensterunterseite fixiert wird.
Abstand ist der Abstand in Pixeln, den das Element während der Fixierungsanimation zurücklegen soll.
Der Trigger-Offset ist der Punkt, an dem ein Element relativ zur Fensteroberseite, Fenstermitte oder Fensterunterseite fixiert wird.
Abstand ist der Abstand in Pixeln, den das Element während der Fixierungsanimation zurücklegen soll.
Wir empfehlen Ihnen, den Artikel "Sticky Elements in Zero Block" zu lesen, um zu erfahren, wie Sie einen Fixierungseffekt erstellen und wie er auf einer Seite aussieht.
