Live Demo:
WordPress Parallax Plugin
Sieh alle Free-Parallax-Effekte in Aktion.
Scrolle – kopiere eine Klasse – fertig.
So funktioniert die Demo
Scrolle nach unten und sieh alle Parallax-Effekte der Free-Version live.
Jeder Effekt basiert auf einer einfachen CSS-Klasse.
SmartParallax unterscheidet zwischen Hintergrund-Parallax (parallax-image)
und beweglichen Elementen (parallax-container).
Beispiel 1: parallax-image
Bewegt nur das Hintergrundbild.Ohne Hintergrundbild → keine Bewegung.
parallax-image parallax-03Beispiel 2: parallax-container
Diese Beispiele zeigen die Standard-Parallax-Bewegung von Elementen.
Jedes Element bewegt sich selbst – unabhängig vom Hintergrund.
parallax-container parallax-02parallax-container parallax--02parallax-container
parallax-02
parallax-xparallax-container
parallax--02
parallax-xBeispiel 3: -s
Diese Beispiele zeigen dasselbe Setup, jedoch mit -s:
Die Bewegung stoppt exakt in der Mitte des Viewports.
parallax-container
parallax-02-sparallax-container
parallax--02-sparallax-container
parallax-02-s
parallax-xparallax-container
parallax--02-s
parallax-xBeispiel 4: Verschachtelte Bewegungen
Parallax-Elemente können beliebig verschachtelt werden.
Jedes Element reagiert unabhängig auf den Scroll.
parallax-container parallax--02-s (außen)
parallax-container parallax--02-s parallax-x (innen)