Wilt u een scroll-effect toepassen in Elementor?

Een van de boeiende dingen bij het ontwerpen van een pagina of sjabloon met behulp van Elementor is dat u bepaalde animatie-effecten kunt toepassen op de pagina of sjabloon waaraan u werkt. Een daarvan is een scroll-effect dat we in dit artikel zullen behandelen.

Het scroll-effect zelf is een functie die beschikbaar is op Elementor Pro. Je moet dus je Elementor naar de pro-versie voor het geval u dit nog niet heeft gedaan.

Wat is het scroll-effect?

Dit is een soort animatie-effect dat optreedt wanneer gebruikers met hun muis over een pagina scrollen. Of het nu omhoog of omlaag is. Het effect kan variëren, afhankelijk van uw instelling. Elementor zelf biedt 6 effectopties:

  • Verticale rol: het object zal verticaal bewegen bij het scrollen met de muis
  • scrollen horizontaal: het object zal horizontaal bewegen bij het scrollen met de muis
  • Transparantie: Object zal als transparant verschijnen voordat de muis scrollt
  • wazig: Object wordt wazig weergegeven voordat de muis scrollt
  • Ladder: Het object verschijnt in een bepaalde schaal voordat de muis scrollt

U kunt een scroll-effect toepassen op een sectie, een kolom of een widget.

Scrolleffect toepassen in Elementor

Zoals we al zeiden, is het scroll-effect een van de functies van Elementor Pro. Met andere woorden, u moet Elementor Pro gebruiken om deze functie te gebruiken.

In deze zelfstudie laten we u zien hoe u een horizontaal scrolleffect toepast. Zoals de naam al doet vermoeden, past dit effect verticale beweging toe op een object wanneer de muis wordt geschoven. Dit effect is uitstekend in combinatie met Lottie.

Hieronder ziet u een voorbeeld voordat u het horizontale scrolleffect toepast.

scroll-effect toepassen in Elementor

En hier is het voorbeeld na het toepassen van de horizontale scroll.

scroll-effect toepassen in Elementor

Remarque: In de volgende zelfstudie wordt Lottie gebruikt.

Scroll-effect toegevoegd

Nogmaals, u kunt het scroll-effect toepassen op een sectie, kolom of widget.

Selecteer eerst een element (sectie, kolom of widget) waarop u het scroll-effect wilt toepassen en ga naar het tabblad vergevorderd in het linkerdeelvenster en open de sectie Bewegingseffecten.

Activeer optie Scroll effecten.

scroll-effect toepassen in Elementor

Omdat we het horizontale scroll-effect willen toepassen, klikt u op het potloodpictogram op de optie Horizontaal scrollen om instellingen te maken zoals richting (links of rechts), snelheid en venster (het gebied dat zichtbaar is voor de gebruiker).

scroll-effect toepassen in Elementor

U kunt desgewenst meerdere scrolleffecten toepassen. Klik gewoon op het potloodpictogram op andere scroll-effectopties om andere scroll-effecten toe te passen.

Dat is het. Zodra de pagina is voltooid, kunt u publiceren / update Het. U kunt het scroll-effect ook uitschakelen op een bepaald type apparaat. Verwijder eenvoudig het apparaat waarop u het scroll-effect wilt uitschakelen door op het pictogram te klikken X meteen Effecten toepassen op .

scroll-effect toepassen in Elementor

Koop Elementor Pro nu!!!

Conclusie

Alstublieft ! Dat is het voor dit artikel dat je laat zien hoe scroll-effect toepassen in Elementor. Als u zich zorgen maakt over hoe u daar kunt komen, laat het ons dan weten binnen commentaires.

U kunt echter ook overleggen onze middelen, als u meer elementen nodig hebt om uw projecten voor het maken van internetsites uit te voeren, raadpleeg onze gids op de WordPress blog creatie of die op Divi: het beste WordPress-thema aller tijden.

Maar in de tussentijd deel dit artikel op uw verschillende sociale netwerken.

...