Parallax ohne JS für einzelne Container
Hier könnt ihr für einzelne Container Hintergrundbilder mit Parallax-Effekt versehen.
Am Ende der Seite fügen wir für jeden Container den wir mit einem Hintergrundbild versehen wollen ein Script ein. Dieses wird dann im Container mit der entsprechenden Klasse definiert.
1. Container
Dieser Container hat als CSS-Klasse den Eintrag "parallax1" ohne Gänsefüßchen bekommen. Das entsprechende Script findet ihr am Ende der Seite.
Um das ganze optisch etwas zu unterstützen zusätzlich das Inline-CSS "padding: 15% 0 15% 0;" ebenfalls ohne Gänsefüßchen.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
2. Container
Dieser Container hat als CSS-Klasse den Eintrag "parallax2" ohne Gänsefüßchen bekommen. Das entsprechende Script findet ihr am Ende der Seite.
Um das ganze optisch etwas zu unterstützen zusätzlich das Inline-CSS "padding: 25% 0 25% 0;" ebenfalls ohne Gänsefüßchen.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
3. Container
Dieser Container hat als CSS-Klasse den Eintrag "parallax3" ohne Gänsefüßchen bekommen. Das entsprechende Script findet ihr am Ende der Seite.
Um das ganze optisch etwas zu unterstützen zusätzlich das Inline-CSS "padding: 10% 0 10% 0;" ebenfalls ohne Gänsefüßchen.
Script
DieseScript per Widget > Quelltext am Ende der Seite einfügen und anpassen.Quellcode markieren & kopieren
