Zum Inhalt

Diese Seite wurde maschinell aus dem Englischen übersetzt und noch nicht von Muttersprachlern geprüft.

Interaktionen und Animation

Fügen Sie Ebenen Interaktionen hinzu, schalten Sie sie je Breakpoint aus, berücksichtigen Sie reduzierte Bewegung und stellen Sie Übergänge ein.

Interaktionen

  • Wählen Sie eine Ebene aus und klicken Sie im Abschnitt Interaktionen der Eigenschaften auf Interaktion hinzufügen. Die Ebene wird eingeblendet, sobald sie sichtbar wird.
  • Jede Interaktion zeigt, wodurch sie ausgelöst wird und was sie tut, etwa Beim Erscheinen · Animieren.
  • Schalten Sie sie auf einem Breakpoint mit Auf Desktop, Auf Tablet oder Auf Phone aus.
  • Reduzierte Bewegung legt fest, was für Menschen geschieht, die ihr Gerät um weniger Bewegung bitten: Nur Einblenden behält eine Einblendung, Aus zeigt die Ebene sofort.
  • Interaktion löschen entfernt sie. Wenn Sie eine Ebene löschen, werden auch ihre Interaktionen entfernt, und Rückgängig stellt beides wieder her.

Übergänge

  • Öffnen Sie Übergang, um einzustellen, wie sich eine Animation bewegt. Die Kurve zeigt es.
  • Feder nimmt eine Dauer und eine Federung. Physikalische Feder nimmt Steifigkeit, Dämpfung und Masse.
  • Beschleunigungskurve bietet fertige Kurven, die Beschleunigungs-Tokens Ihres Projekts oder eine Eigene Kurve mit zwei Griffen.
  • Sofort wechselt sofort. Verzögerung wartet vor dem Start, und Versatz startet die animierten Ebenen nacheinander.

Hover, Drücken und Fokus

  • Wählen Sie eine Ebene aus und klicken Sie unter Zustände auf Hover, Drücken oder Fokus. Solange ein Zustand gewählt ist, gilt, was Sie in den Eigenschaften ändern, nur in diesem Zustand.
  • Übergang legt fest, wie die Ebene in den Zustand wechselt. Löschen entfernt, was der Zustand ändert, und Fertig kehrt zur Ebene selbst zurück.
  • Hover ist nur auf Geräten zu sehen, die es können, etwa einem Computer mit Maus.

Auslöser und Aktionen

  • Auslöser legt fest, was eine Interaktion startet: das Erscheinen der Ebene, das Laden der Seite, ein Klick, Hover, Drücken oder der Tastaturfokus.
  • Ein Klick, Hover, Drücken oder Fokus kann mit Animieren die Ebene auf die Werte unter Animiert zu bringen oder mit Scrollen zu zu einer anderen Ebene scrollen und Abstand Pixel über ihr anhalten.
  • Eine Ebene, die ein Link ist, kann beim Klicken nicht auch eine Interaktion starten.

Interaktive Elemente

  • Interaktive Elemente fügen Sie aus der Gruppe Interaktiv des Bereichs Einfügen ein. Wählen Sie eines aus, um seine Einstellungen unter Element zu ändern.
  • Ein Element, das mit einer Funktion erstellt wurde, die dieser Editor nicht hat, bleibt unverändert. Element weist darauf hin, und die veröffentlichte Seite zeigt es als leere Box.

Scroll-Auslöser

  • Wählen Sie Beim Scrollen zum Element als Auslöser, um eine Ebene zu animieren, solange eine Ebene sichtbar ist, und zurück, wenn sie den Bildschirm verlässt.
  • Ebene im Blick ist die Ebene, die sichtbar werden muss: Diese Ebene oder ein anderer Abschnitt oder eine benannte Ebene der Seite.
  • Abstand gibt an, wie viele Pixel davon sichtbar sein müssen, bevor die Animation beginnt.

Akkordeons

  • Ein Akkordeon zeigt Fragen, deren Antworten sich per Klick öffnen, wie eine FAQ. Jedes Element ist ein Rahmen darin: Seine erste Ebene ist die Frage, der Rest die Antwort.
  • Unter Element lässt Mehrere gleichzeitig offen Besucher mehr als eine Antwort offen halten; sonst schließt das Öffnen einer Antwort die anderen. Zuerst offen ist das Element, das geöffnet beginnt (0 für keins).
  • Beim Bearbeiten sind alle Antworten sichtbar, damit Sie sie direkt ändern können. Die veröffentlichte Seite braucht kein Skript, und per Tastatur öffnen und schließen Sie die Antworten mit Eingabe oder Leertaste.

Laufbänder

  • Wählen Sie einen Zeilen-Stapel oder eine Sammlungsliste aus und wählen Sie In Laufband einschließen in der Befehlspalette. Die Elemente laufen dann auf der veröffentlichten Website endlos durch; im Canvas steht das Laufband still.
  • Legen Sie unter Element die Geschwindigkeit (px pro Sekunde), die Richtung und die Geschwindigkeit unter dem Zeiger fest (0 hält es an). Legen Sie die Geschwindigkeit auf einem anderen Breakpoint fest, um sie nur dort zu ändern.
  • Ein Laufband hält außerhalb des Bildschirms an und steht still für Besucher, die reduzierte Bewegung bevorzugen. Screenreader lesen seine Elemente einmal.

Karussells

  • Wählen Sie einen Zeilen-Stapel oder eine Sammlungsliste aus und wählen Sie In Karussell einschließen in der Befehlspalette. Die Elemente werden zu Folien, durch die Besucher wischen, scrollen oder mit den Pfeilen, den Punkten oder den Pfeiltasten blättern.
  • Schalten Sie unter Element die Pfeile und Punkte ein oder aus, wählen Sie Endlos oder Automatisch abspielen alle paar Sekunden; das hält an, solange der Zeiger oder der Tastaturfokus darauf liegt.
  • Die Namen der Schaltflächen sind Website-Text: Schreiben Sie sie in der Sprache der Website und übersetzen Sie sie wie jeden anderen Text. Im Namen eines Punkts ist {n} die Foliennummer.

Eine Variante wechseln

  • Eine Interaktion kann eine Instanz einer Komponente zu einer anderen ihrer Varianten wechseln: Wählen Sie Variante wechseln als Aktion, dann die Instanz auf der Seite und die Variante. Ein Klick, ein Hover, ein Drücken, der Tastaturfokus oder das Scrollen zum Element kann sie auslösen; Hover, Drücken, Fokus oder Scrollen kehren zur vorher gezeigten Variante zurück, wenn sie enden.
  • Der Wechsel wird mit dem Übergang der Variante animiert: Wählen Sie im Master der Komponente die Variante unter Varianten und legen Sie fest, wie sie erscheint. Nur die Eigenschaften, die die Variante ändert, werden animiert.

Aktualisiert am 13. Oktober 2026