M:D Scroll — Smoothing PoC

Mausrad und Trackpad erhalten einen einstellbaren Nachlauf. Vergleiche direkt mit dem nativen Scrollgefühl und scrolle anschließend durch die Reveal-Beispiele.

Scrollgefühl vergleichen

Natives Scrollen; Smoothing wird vorbereitet.

Die Regler gelten bis zum Neuladen. Mit deaktiviertem Smoothing kannst du das native Scrollgefühl vergleichen.

Zu Kadence · Zum Seitenende · Zum Medien-Test

Eigenen Scrollbereich testen

Dieser Bereich scrollt nativ. Bewege das Mausrad innerhalb dieses Feldes.

Ende des inneren Scrollbereichs.

01 / WordPress Core

Diese Überschrift und dieser Absatz liegen in einer nativen Group. Beide blenden unabhängig ein; die Group bleibt an ihrem Platz.

Bestehendes Brand-Foundation-Motiv als Bildtest

02 / Kadence Row → Section → Inhalte

Linke Kadence Section

Auch tief verschachtelte Core-Inhalte werden erkannt.

Eine weitere Group innerhalb der Kadence Section.

Rechte Kadence Section

Kein Effekt muss an den einzelnen Blocks konfiguriert werden.

Kadence Section direkt im Wrapper

Eine Row ist für diese Section nicht erforderlich.

03 / Verschachtelung & Ausnahmen

Die äußere Section animiert ihre eigenen Inhalte.

Innere M:D Section

Eigener Fade-Effekt, ohne doppelte Animation durch den äußeren Wrapper.

Bewusst statisch

Dieser gesamte Bereich trägt md-reveal-skip.

Als Einheit

Dieser Bereich trägt md-reveal-item und bewegt sich als eine gemeinsame Karte.

04 / Bestehendes Kadence AOS

Kadence behält die Kontrolle

Diese Section verwendet bereits Kadence fade-up. M:D lässt sie und ihre Inhalte aus.

Dieser Absatz verwendet weiterhin den M:D Reveal.

05 / Wiederholbarer Fade

Scrolle aus diesem Bereich heraus und wieder hinein. Hier ist „Nur einmal“ ausgeschaltet.

PoC v0.1 · Bei reduzierter Bewegung bleiben M:D Inhalte statisch sichtbar. Im Editor sind Animationen deaktiviert.