Erfahren Sie, wie Sie einen Parallax-Hintergrund für Elementor erstellen

Last Updated on 11/10/2021 by MTE Leben

Parallax Elementor-Effekt zum Website-Hintergrund hinzufügen

Parallax ist ein trendiger Effekt, der mit WordPress-Themes verwendet wird, um ein Objekt langsamer zu bewegen als andere. Es hilft Ihnen, Animationen zu den Seiten hinzuzufügen, wenn Benutzer durch Ihre Site navigieren.

Das Hinzufügen von Parallaxe zu Ihrem Website-Hintergrund ist eine einfache Aufgabe, insbesondere für diejenigen, die das Mehrzweck-Theme Monstroid2 verwenden. Dieses Thema enthält alle notwendigen Elemente und Funktionen, um verschiedene Parallax-Effekte zu erstellen und sie mit verschiedenen Objekten auf den Webseiten zu verwenden.

Sehen wir uns an, wie man den Hintergründen der Monstroid2-basierten Vorlagen Parallaxe hinzufügt :

• Wählen Sie nach der Aktivierung des M2-Themas die Skin, die am besten zu Ihnen passt, und installieren Sie sie, um mit der Bearbeitung zu beginnen.

Einige der M2 vorgefertigten Seiten haben bereits einen Parallaxeneffekt. Um es zu bearbeiten, müssen Sie die Seite mit dem Effekt mit dem Elementor-Editor öffnen.

• Nach dem Öffnen des Editors sollten Sie den Hintergrundbereich auswählen, in dem Sie den Parallax-Effekt hinzufügen oder ändern möchten. Klicken Sie mit der rechten Maustaste darauf und wählen Sie im erscheinenden Fenster „Abschnitt bearbeiten“.

• Öffnen Sie „Jet Section Parallax“. Dort können Sie die Elemente hinzufügen, mit denen Sie den Parallax-Effekt verwenden möchten. Sie können weitere Elemente hinzufügen und die verschiedenen Parallax-Typen für jedes der Elemente auswählen, indem Sie sie übereinander legen.
• In dieser Vorlage haben wir zwei Pre -entworfene Gegenstände mit Parallaxe und wir müssen eine weitere hinzufügen, um Parallaxe auf unseren Hintergrund anzuwenden. Klicken Sie also auf die Schaltfläche “+ Artikel hinzufügen”.

• Wählen Sie das benötigte Bild im Abschnitt „Bild auswählen“ oder laden Sie es hoch, um mit der Abstimmung der Parallax-Funktionen zu beginnen. In die Registerkarten unten sollten Sie die Parallaxengeschwindigkeit und ihren Typ einfügen. Für unseren Hintergrund wählen wir solche Indizes:

Parallax Speed: 30

Parallaxentyp: Vertikales Scrollen
Z-Index: 0

X-Position des Hintergrunds (%): 50
Y-Position des Hintergrunds (%): 50
Hintergrundgröße: Cover

Animationseigenschaft: Transform
Aktivieren auf Gerät: Desktop, Tablet

• Und schau was wir damit bekommen:

Wir haben die Parallaxe zu unserem Hintergrund hinzugefügt. Um eine Vorschau anzuzeigen, scrollen Sie auf der Seite nach unten und Sie werden sehen, dass sich die Objekte mit einer anderen Geschwindigkeit bewegen.

Sie haben die Möglichkeit, so viele Objekte hinzuzufügen, wie Sie benötigen, und eine Parallaxe auf jedes von ihnen anzuwenden Sie. Und wenn Sie nach gebrauchsfertigen Vorlagen mit Parallax-Hintergründen suchen, achten Sie auf das Mehrzweck-Theme Monstroid2. Hier finden Sie alle notwendigen Funktionen zum Arbeiten.