Wix Editor: Animations- und Scroll-Effekte auf deiner mobilen Website verwenden

4 Min. Lesezeit
Animationen und Scroll-Effekte lenken die Aufmerksamkeit auf wichtige Elemente und Inhalte und machen deine Website für Besucher zu einem unterhaltsamen Erlebnis.
Mobile-Animationen wurden für deine Mobile-Website handverlesen und für kleinere Bildschirmgrößen und Auflösungen optimiert, sodass du dir keine Gedanken über den Abstand oder die Ausrichtung deiner Website machen musst. Du kannst auch tolle Scroll-Effekte zum Hintergrund deiner Streifen, Spalten und Abschnitte hinzufügen, um wichtige Inhalte für Mobile-Besucher hervorzuheben.
Erfahre mehr über folgende Themen:
Wichtig:
Desktop- und Mobile-Animationen sind separate Funktionen. Das bedeutet, dass sich Animationen, die du zu Elementen auf deiner Desktop-Website hinzufügst, nicht auf deine Mobile-Website auswirken und umgekehrt. Wenn du auf deiner Mobile-Website keine Animation einstellst, wird keine Animation angezeigt. Erfahre mehr über Animationen auf dem Desktop.

Animationen zu deiner mobilen Website hinzufügen

Füge deinen Elementen einen Animationseffekt hinzu, um sie zum Leben zu erwecken. Es stehen 14 Effekte speziell für Mobile zur Auswahl, sodass du eine Animation hinzufügen kannst, die zu deinem Stil passt.

Um einem Element eine Animation hinzuzufügen:

  1. Klicke im Mobile-Editor auf das entsprechende Element.
  2. Klicke auf das Symbol für Animation .
  3. Wähle eine Animation aus den verfügbaren Optionen aus.
Tipps:
  • Fahre mit der Maus über einen Effekt im Panel, um eine Vorschau der Animation zu sehen.
  • Klicke im Panel Animation wählen auf Keine, um einen Animationseffekt von deinem Element zu entfernen.

Die Animation auf deiner mobilen Website anpassen

Nachdem du eine Animation für dein Element ausgewählt hast, kannst du diese anpassen, um einen einzigartigen Effekt zu erzielen. Passe je nach ausgewählter Animation Einstellungen wie Verzögerung, Richtung und Zeitpunkt an.

Um die Animation anzupassen:

  1. Klicke auf das Element.
  2. Klicke auf das Symbol für Animation .
  3. Klicke auf Animationseinstellungen und passe deine Animation an:
    • Leistung: Wähle aus dem Aufklappmenü aus, wie stark der Effekt sein soll.
    • Richtung: Wähle aus, aus welcher Richtung die Animation kommt.
    • Dauer: Wähle aus, wie lange die Animation abgespielt werden soll (in Sekunden).
    • Verzögerung: Lege die Verzögerung (in Sekunden) zwischen dem Laden der Seite und dem Abspielen der Animation fest.
    • Nur beim ersten Laden: Klicke auf den Schalter, um auszuwählen, wann deine Animation abgespielt wird:
      • Aktiviert: Die Animation wird nur beim ersten Laden der Seite abgespielt.
      • Deaktiviert: Die Animation wird jedes Mal abgespielt, wenn die Seite aus demselben Tab geladen wird.
GIF, das die Animationseinstellungen im Mobile-Editor zeigt. Der Cursor klickt auf den Wiedergabe-Button, um eine Vorschau der Animation anzuzeigen.
Tipp:
Klicke oben im Panel auf das Wiedergabe-Symbol , um zu sehen, wie der Effekt auf deiner Live-Website aussieht.
Animationen werden auf deiner Live-Website nicht abgespielt?
Dein Gerät verfügt möglicherweise über eine aktivierte Bewegungsreduzierung. Erfahre mehr über reduzierte Bewegungen und andere Ursachen für Animationsprobleme

Scroll-Effekte zu deiner mobilen Website hinzufügen

Füge dem Hintergrund von Streifen, Spalten und Abschnitten auf deiner mobilen Website auffällige Scroll-Effekte hinzu. Die Effekte werden nicht auf deiner Desktop-Website angezeigt, sodass du ein maßgeschneidertes Erlebnis für Mobile-Besucher schaffen kannst.

Um einen Scroll-Effekt nur für Mobilgeräte hinzuzufügen:

  1. Klicke in deinem Mobile-Editor auf den Streifen/die Spalte/den Abschnitt.
  2. Klicke auf das Symbol für Animation .
  3. (Für Streifen und Spalten) Wähle aus dem Aufklappmenü die Option Scroll-Effekt.
  4. Wähle den gewünschten Scroll-Effekt im Panel aus. Verfügbare Scroll-Effekte anzeigen
Das solltest du wissen:
  • Es ist nicht möglich, einem Streifen oder einer Spalte sowohl eine Animation als auch einen Hintergrund-Scroll-Effekt hinzuzufügen.
  • Du kannst Abschnitten nur Hintergrund-Scroll-Effekte hinzuzufügen, da andere Animationseffekte in Abschnitten nicht unterstützt werden.
  • Es ist nicht möglich, Effekte zu Streifen hinzuzufügen, die Spalten enthalten. Du kannst jedoch den Spalten selbst eine Eingangsanimation oder einen Hintergrund-Scroll-Effekt hinzufügen.
Hinweis:
Die verfügbaren Scroll-Effekt-Optionen hängen vom Hintergrundtyp (Farbe, Bild oder Video) ab.

War das hilfreich?

|