Parallax Tilt

von Feb. 15, 2019.json, CSS


DEMO


WIE MAN EINEN TILT-EFFEKT IN DIVI HINZUFÜGT

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Parallax Effect

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Glare Effect

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Simple Effect

Schritte für den Tilt-Effekt

1. Lade Dir die Tilt- Datei herunter
2. Dateien entpacken
3.Importieren die Datei Tilt Effects.json auf Divi -> Divi Library -> Import & Export Button

4. Nach dem Importieren der Layout-Json-Dateien siehe unten
5. Fügen eine neue Seite hinzu und klicke auf “Aus Bibliothek hinzufügen” ODER “+” im unteren Bereich

Neuer Divi Builder

Alter Divi Builder
7. Nachdem Du das Layout ausgewählt hast, klicke auf den Abschnitt, dann auf Seite veröffentlichen, und gehe weiter zu Punkt 8.

8. Hier sind die die Möglichkeit wie Du die Scripts einbinden kannst.

1. Verwenden des Child-Designs
Im Entpacken-Ordner kannst Di die Datei „DPDiviChild.zip“ finden. Lade sie einfach hoch und aktivieren sie.

Wenn bereits ein untergeordnetes Design vorhanden ist, folge dem nachstehenden Schritt –> Kopiere den Ordner “js” und fügen ihn in Dein vorhandenes untergeordnetes Design (Theme) ein.
–> Kopiere den Code “dp_tilt_scripts” der Enqueue-Skriptfunktion und füge ihn in die vorhandene untergeordnete Datei “functions.php” ein.
–> Kopiere den style.css-Code und füge ihn in die vorhandene style.css-Datei des untergeordneten Designs (Child-Theme) ein.

2. Ohne untergeordnetes Design Child-Theme
–> Lade die Datei „vanilla-tilt.min.js“ auf Deinen Server oder an eine beliebige andere Stelle und füge diesen Pfad unter Divi –> Theme Options –> Integration Tab ein.
–> Kopiere den js-Code aus der init-tilt.js-Datei und füge ihn unter Divi –> Theme Options –> Integration ein.
Schreibe einfach ein Script-Tag vor dem Startcode und beende das Script-Tag, wenn der Code beendet ist.

Siehe Bild

–> Kopiere den Style-Code aus der style.css-Datei und füge ihn in Divi –> Theme Options –> General –> Custom CSS ein.

Siehe Bild

Verwende für Simple Effect die Klasse “dp-tilt-column” für das Modul.
Verwenden Sie für Parallax-Effekt die Klasse “dp-tilt-column-parallex” für das Modul.
Für Blendungseffekte verwenden Sie die Klasse „dp-tilt-column-glare“ im Modul.

Siehe Bild
WP-DIVI-Tutorials
..:: WordPress | Divi | Plugins | CSS | uvm ::..