MOVING TEXT ON SCROLL - Elementor Wordpress Tutorial Flex Container

preview_player
Показать описание
We're harnessing the power of Elementor with this no-code feature. Simple but interesting and hopefully useful!

Timestamps:

00:00 Intro
00:15 Demo
08:05 Outro

Thank you for watching!

🟠 SUBSCRIBE TO THE NEWSLETTER:

🟠 TRY ELEMENTOR

🟠 TRY HOSTINGER

🟠 WORK WITH ME

🟠 YOU CAN FIND ME HERE TOO

TWITTER - @AndreeaEgli

🟠 FOR BUSINESS ENQUIRIES

Disclaimer - Some links in my videos' description box may be affiliate links, meaning I will make a commission on purchases you make through my link. This is at no extra cost to you to use my links/codes, it's just one more way to support me and my channel! :)

#elementortutorial #elementorpagebuilder #elementortipsandtricks
Рекомендации по теме
Комментарии
Автор

How do you see yourself using this feature?

andreaegli
Автор

Wow! The way you demonstrated moving text on scroll using Elementor is incredibly helpful. Thanks for the fantastic tutorial! 👏💯

smartwebsource
Автор

Nice tutorial!
The negative margin you applied at 3:43 bothered me though.
This causes the wrapping behavior on tablet and mobile. When the text becomes too big it will wrap again.

I looked into it and I found a CSS solution.
Eventually I thought I could simply solve this with flex-wrap: nowrap on the ul and white-space: nowrap on the li to prevent the words to break.
And indeed, when I tried that in the Chrome devtools it worked like a charm, but it didn't in the Elementor editor.
When I checked the devtools I noticed the CSS was simply ignored possibly due some specificity issues I can't solve.

So I tried it with CSS grid...
Do the same thing, but DON'T add the negative margins.

Instead add this CSS in the iconlists

selector .elementor-widget-container {
overflow: visible;
}
selector ul {
display: grid;
grid-auto-flow:column;
}
selector li {
white-space: nowrap;
}

Now the text will never wrap again and you can make it as big and small as you want.

franktielemans
Автор

Hello Andrea! Really good content here, thank you very much 😊 I wonder if there a way to make the scroll marquee fully vertical, filling the whole website from top to bottom. What do you think?

AdrianLopezpuntocom
Автор

An interesting story about how I got into your videos. Two weeks ago a client told me that the price I was charging for a website was too high. He said: "Your website doesn't worth this much. Look at these websites!" (he showed me 5 GREAT websites). He continued: "Money is not the problem here, but if I'm going to spend a high amount of money on something, this something must deliver more than the standard. Everyone can do what you do for a lower price".

I realized that I was delivering a mediocre service (websites, design, branding, ...you name it). Big clients want great ideas, great deliveries, out of the box thinking. Then I asked myself: "What IS the extraordinary? What is an extraordinary website? What makes a great website...Great?". I discovered that websites that tell a story, have good interactions / animations make their eyes shine (and let's be honest: these are really cool features).

That's how my "pursuit of the extraordinary" lead me to your channel. Every technique that you teach here is GOLD for increasing the website experience. Every video you make is a key to unlock a new opportunity for better websites, betters interactions, self-confidence.

So, I just want to thank you so much for sharing your knowledge, for being so kind and helping others to increase their service level. You are awesome, Andrea. Thank you, thank you!

fernandopaiva
Автор

Amazing as always. Do you have a trick to add scrub to the scrolling?

robby_carter
Автор

will never get enough of these videos, loved it!

joelroblesmunoz
Автор

Really cool technique, thanks for sharing!!

Andresvideo
Автор

this videos are gold please keep uploading they are different and more pro

zafit
Автор

Hi Andrea, I'm a fan of your channel, but I have a question about this video. How do I remove the green/red guide that appears on the side of the page? This guide appears to me on the normal web.

beuvrin
Автор

Love this tutorial. I can’t find scroll effect on my Elementor, is it a pro feature only?

PPreye
Автор

Amazing videos, please make a video on image scroll parallax effect in elementor, as you have shown color changing effect on scroll, please make it
Thank you for making such videos they are very useful for us🎉

khadija_sultan
Автор

your videos are incredible! congratulations for the work

thiagom
Автор

I like all video Elementor thank you maam because I have learn a lot of video

HamzaKhan-kj
Автор

You are so sweet..! Love to watch you do the tutorial..☺

futuretechtv
Автор

Hehe hello how you are doing good
Tip for you to work quick 😉
.
After changing typography r margins etc of one container you can just click on copy and then paste style on the other will make it automatically like first one
No need to do it like this again.
Wonderful videos though
Thank you 😊

monarmy
Автор

can we do similarly for image when we scroll images move

AdityaSingh-nivn
Автор

full menu with creative popup please make video Elementor

HamzaKhan-kj
Автор

okeyyy got it but I want to make it infinite loop

techywarrior
Автор

I love you. That's all I want to say to you <3

SerenaKoeber