I’m an aspiring web developer with a deep interest in frontend design. I’ve been following your channel for some time now, and your tutorials have been incredibly inspiring and informative for me. I'm eager to improve my skills in web design and was wondering if you might have any advice or resources you could recommend. I would be extremely grateful for any guidance you can offer, whether it’s on techniques, best practices, or anything else that could help me grow in this field. Thank you so much for all the value you provide through your content. I look forward to possibly learning more from you.
Amazing video, appreciated it a lot. Btw what theme are you using? Hello theme with header and footer plugin? Thanks again for the super helpful video.
Update for those using Elementor Free: After releasing this video, I realized that the "sticky" effect in motion effects is not part of the free version of Elementor. I missed that, sorry! Since this video has gained so much attention, I will MAYBE try to create a new updated version for those of you who don't have Elementor Pro.😎 But only if is possible of course.
to make sticky with gsap, without elementor pro you can the pin option, point ScrollTrigger to a ID or Class of the video, remove 500vh of extra space, the pin option add the neccessary extra space automatically
Hey Nicolai thanks for the great content, I just bookmarked it ! I'm curious : what video (editing) software do you use ? Thanks for your reply in advance ! +1 sub 😉
Thanks, Loris You can get my screen recorder here: screenstudio.lemonsqueezy.com?aff=2pmgR It automatically zooms in and out when you click on something. Really handy!
@@ONMXDigital-wh6ig You can find it Here: screenstudio.lemonsqueezy.com?aff=2pmgR The software automatically zooms in and out when I click on something. Really cool!
Hi Nicolai, very cool and thanks i will use it but you forgot to show the header after the red parter it goes white and after that Home and About us and so on are than invisible 🙂
Great content! just trying to implement this myself but I have a container above the video section that I want to use, how do I offset that so the video doesn't start playing until it gets to the section with the video panel in?
Update for those using Elementor Free: After releasing this video, I realized that the "sticky" effect in motion effects is not part of the free version of Elementor. I missed that, sorry! Since this video has gained so much attention, I’ll maybe try to create a new updated version for those of you who don't have Elementor Pro.😎
Thank you it's very helpful, i hope you read this but i found some problems, it creates every video on the page as the same class so it affects every video in it. how do you solve this issue? thank you
Hi Nicolai, Your tutorials are very useful. Thank you so much for sharing such a helpful tutorials. I have a question. I wanted to combine two things to design a home page. Using this tutorial as a hero section and using "REVEAL CONTENT ON SCROLL - GSAP Elementor Scrolltrigger" for the rest of the page. But both are not work combinedly. Is there any way to combine these both?
great video my man, but this animation wont work on other responsive modes, specially phones... can you help making it work on the phone, and to dsiplay the animation section as leghnthy ???
Hello, that trick seems very cool but I can't figure how to make it work... I did setup everything carefully but when I scroll down the video immediatly switch from the beggining to the end with no intermediate. Do you have any clew? I am use a theme provided by bluehost
Thanks! You can find The screen recorder here: screenstudio.lemonsqueezy.com?aff=2pmgR It automatically zooms in and out when you click on something. Really handy!
Hello sir, actually I found it pretty easy and I have a question If I am building the entire website in MERN let's say I will write code for frontend in React js So i just want to know can we integrate this scrolling effect in react?
Great video ! Does anybody know how we can turn a video into similar type that plays in this animation, like a timelapse, but its different than if we just drop framerate of the video.
![SPIN CAROUSEL ON SCROLL - GSAP ScrollTrigger Elementor [No plugin]](http://i.ytimg.com/vi/nRB49gj6sVA/mqdefault.jpg)
![SPIN CAROUSEL ON SCROLL - GSAP ScrollTrigger Elementor [No plugin]](/img/tr.png)
![Megan Thee Stallion - Neva Play (feat. RM) [Official Video]](http://i.ytimg.com/vi/TpYTyAaTRts/mqdefault.jpg)
can I get the video link so I can upload and work with it ?
You can download the watermelon video for free here: michellewp.gumroad.com/l/szkhqc
or the entire template: michellewp.gumroad.com/l/jibhmn
@@nicopalmkvist I'm truly grateful for the tremendous effort you put in for us. Thank you so much.
@@Zakariae17 You are welcome, champ!
No joke you are a legend this videos are just missing on youtube and this is the future of web development. Thank you 🙏🏼❤
@@nadav12617 I appreciate comments like this - thank you!🩵
@@nicopalmkvist bro, you are really great
I wasn't looking for this video. But I am certainly not complaining.
And I will thank you for it. I will surely use this on my next project.
Wow great work here!
Please continue doing videos like this with GSAP and Elementor
Your wish is my command 😇
NIce! I've been using a plugin this whole time that uses photos instead of just the straight up video, This is so much better! Thank you!
Pleased to assist you in finding a free and simpler solution :)
Top quality content, I really liked the design. You keep it fresh and innovative webdesign. Thank you for sharing
I appreciate comments like this! Thanks @eekeek433
Wow, very stunning effect. Looking forward to apply this effect in one of my projects.
Feel free to share a link if you use it in some of your projects. We would love to see that!
that truck example was funny 😆😆
I should have used that website as a lead example instead of the watermelon website 😂 Jean-Claude Van Damme is the man!
@@nicopalmkvist 😀😀
Wow, just stumbled on this video. This is by far the easiest way to create beautiful scroll triggers with elementor. You just got a new sub 🔥🔥
I appreciate it, jesubayoshola 😎
This video is a gem. Thanks Nicolai ❤
@@buildwithsohanur Thanks, Sohanur 🩵
I cannot say enough how much your videos have helped me to make my webpage, you are a LEGEND!
This video is helpful for me, thank you very much!
@baole-l9y Thanks! More content on the way :)
Great valuable content once again thanks
@Mcribs1235 thanks man
May the Lord bless this man richly for the rest of his life.
Thanks, great and clean guideline video. really usefull
Subscribed. Expecting more elementor+gsap in the future 🤘
Great video! Would love to see you doing this magic on webflow as well❤
Thank you so much for this, I’m really happy about this. Love it, will test it out
@@CaterStudios Thank you, mate 💪
awesome, now we are talking 😁 you should have tell us of how many sec of video to take
Thanks, mate! Go for 8 sec - thats what I did 👨🏭
@@nicopalmkvist thanks mate 😃
I’m an aspiring web developer with a deep interest in frontend design. I’ve been following your channel for some time now, and your tutorials have been incredibly inspiring and informative for me. I'm eager to improve my skills in web design and was wondering if you might have any advice or resources you could recommend. I would be extremely grateful for any guidance you can offer, whether it’s on techniques, best practices, or anything else that could help me grow in this field. Thank you so much for all the value you provide through your content. I look forward to possibly learning more from you.
Wow, that's super cool! I appreciate your effort in making this video and providing the link to the file to play with.
Thank you so so much! Now I can create a blender video and insert it!!! No need for 3JS :)
Very nice! Keep up the good work!
Thanks for sharing, this is great
i was looking for a simple method like this for month! Thank you so much!
yoo Nicolai, thanks a lot brother
I’m glad you enjoyed it, blackstuffguy ;) !
how awesome, thank you!
amazing video thanks for sharing!!
I'm glad you enjoyed the video! Thanks for watching!
Crazy Crazy Crazy
@praveenraj8704 💪💪
Amazing ❤ thanks bro
@rossinidesigner1 💪💪
Very Good Work Boy!!! 💪
@onnoideas thanks 💪
Your channel’s content is lit! Every design is next-level awesome!
🥰@poppydoo-i5n
I subscribed to your channel after the first 3 seconds. DAMNNNN this content is on fire. Thank you for this, Nicolia.
You deserve my like and subscription!
Thanks a ton! New video will be released tomorrow at 10:00 AM. ;)
This video is so juicy!
I actually got a bit thirsty while making it 🍉
Love it❤
great tutorial + meme effect, keep doing video like this!
Thank you, @99savage_XXX
awesome thx
@dercrazed 💪
This is awesome! Thank you so much for the tutorial!!
Amazing video, appreciated it a lot. Btw what theme are you using? Hello theme with header and footer plugin? Thanks again for the super helpful video.
Thanks, Daniel. I use Astra theme 💪
Hvis du ikke er dansker så er jorden flad 🤣 "Dan-glish"
God video! 😂😆
🤣🤣🤣 Du har ingen ide om hvor mange gang jeg har tænkt "Wow, hvordan fanden slipper jeg afsted med den her accent"
Men det gør jeg altså ;)
Amazing and simple
Nice, I implemented it into a static site.
Great work, What about the mobile version. Its not working properly for me. Any suggestion?
did you find a solution?
U just got a subscriber 😁
So awesome, thanks bro! 🎉
@thewebstylist More like this on the way 🔜
Bro is a LEGEND! Subscribed!
Update for those using Elementor Free:
After releasing this video, I realized that the "sticky" effect in motion effects is not part of the free version of Elementor. I missed that, sorry!
Since this video has gained so much attention, I will MAYBE try to create a new updated version for those of you who don't have Elementor Pro.😎 But only if is possible of course.
Hello Nico, thanks for the usefull info, is there any possibility to stop the video to scrolling down all the entire page?
to make sticky with gsap, without elementor pro you can the pin option, point ScrollTrigger to a ID or Class of the video, remove 500vh of extra space, the pin option add the neccessary extra space automatically
❤❤❤❤
🫶 @zuberalii
Great Elementor tip!
Niiiice man! More vids pleasse ;)
New ScrollTrigger video will be released tomorrow at 10:00 AM. ;)
Hey Nicolai thanks for the great content, I just bookmarked it !
I'm curious : what video (editing) software do you use ?
Thanks for your reply in advance !
+1 sub 😉
Thanks, Loris
You can get my screen recorder here:
screenstudio.lemonsqueezy.com?aff=2pmgR
It automatically zooms in and out when you click on something. Really handy!
@@nicopalmkvist thanks for the reply unfortunately I'm not on mac ^^
Have a nice day !
amazing, ive been looking for a solution like this :D
Cool! I loved the content, one question, which screen recorder do you use? Very cool.
@@ONMXDigital-wh6ig
You can find it Here:
screenstudio.lemonsqueezy.com?aff=2pmgR
The software automatically zooms in and out when I click on something. Really cool!
So Amazing
Thanks a lot, glad you liked it! 💪
What about mobile version?
it sucks
you looks like tom cruise, by the way good video
Legend! Thank you!
AMAZING !!!!!
Genius!
💪 @seoprone
thank you very much, no bullshit, full value
Thats Sick mate WTF
Amazing
Thank you so much!!
Hi Nicolai, very cool and thanks i will use it but you forgot to show the header after the red parter it goes white and after that Home and About us and so on are than invisible 🙂
Great content! just trying to implement this myself but I have a container above the video section that I want to use, how do I offset that so the video doesn't start playing until it gets to the section with the video panel in?
AMAZING 🎉
You're amazing too! @tobiasagossou!
where have u beeeeeeeeeeen
Disclaimer : u should buy elementor pro 🗿
Update for those using Elementor Free:
After releasing this video, I realized that the "sticky" effect in motion effects is not part of the free version of Elementor. I missed that, sorry!
Since this video has gained so much attention, I’ll maybe try to create a new updated version for those of you who don't have Elementor Pro.😎
@@TheBrinq You can try the Royal Elementor plugin, Sticky feature. It works for me.
@@nicopalmkvistthat would be very very helpful 💯
Bro, just google for elementor pro for free. U'll definitely fine one with updates
Thank you it's very helpful, i hope you read this but i found some problems, it creates every video on the page as the same class so it affects every video in it. how do you solve this issue? thank you
Bro can you pls make tutorials of these cool elements using Vs Code please .. Btw amazing work❤
very informative you gained a new subcriber 👏👏🎊🎊please upload a detail video step by step on elementor tutorial
Thanks @sportPulse! One of my next videos will be a Elementor course 🔜💪
@@nicopalmkvist perfect 👏👏🎊🎊
bravo
✊
Genius👏👏👏👏👏
Soo cool thanks ❤
Glad you enjoyed the video ❤ @insidearmy
Thank you! Great video! Easy to follow along!
Video frame convertor is not available
Here you go:
www.video2edit.com/convert-to-video
Instead of that you can use motion-one libraries with scroll function
great video ! i dont know why, i've done everything like you, but it is not sticky, but i activate "stick-top"
Great video, congratulations on the explanation, but unfortunately, you need Elementor Pro to use the motion effects.
Hi Nicolai, Your tutorials are very useful. Thank you so much for sharing such a helpful tutorials.
I have a question. I wanted to combine two things to design a home page. Using this tutorial as a hero section and using "REVEAL CONTENT ON SCROLL - GSAP Elementor Scrolltrigger" for the rest of the page. But both are not work combinedly. Is there any way to combine these both?
Put a class name in css settings and call that out and add a position:sticky
Just scrolling scrolling yuotube and fotunately found a Gem
Thanks, mate - New ScrollTrigger video will be released tomorrow at 10:00 AM. ;)
great video my man, but this animation wont work on other responsive modes, specially phones... can you help making it work on the phone, and to dsiplay the animation section as leghnthy ???
Video playing like a popup with black ground when first opening in the Mobile view, how to fix it? please help
Bro you are Awesome, 😎❤ just subbed
Hey, thanks for the sub, bro! I'm glad you're enjoying the content. 💪
OMG the cover pic....are you Dexter?? >_
THANKSSSSSSSSSSSSSs
"all of our food keeps blowing up 🗣️🗣️🗣️🗣️🔥🔥💥🔥💥"
That's cool
Well done ! Thanks for that video !
What if I want the same effect, but in a different place on the page?
Hello, that trick seems very cool but I can't figure how to make it work... I did setup everything carefully but when I scroll down the video immediatly switch from the beggining to the end with no intermediate. Do you have any clew? I am use a theme provided by bluehost
First of all thank you for your amazing tutorial 😍😍
and second may i ask what is your screen recorder?
Thanks!
You can find The screen recorder here:
screenstudio.lemonsqueezy.com?aff=2pmgR
It automatically zooms in and out when you click on something. Really handy!
@@nicopalmkvist Yeah 😍 Thanks
Is the code responsive for mobile and tablet?
Nice video! Also I have a question, do u use any software to record mouse movements? They look really smooth!
Thank you! - I use this screen recorder software: lifeonablock.com/screencast
@@nicopalmkvist Thank you!
Does that HTML code work with the Gutenberg editor? Love this effect, and have been trying to find a way to make it work in Gutenberg!
That is sick. Does it work on mobile view?
Is there a way to make the video more smooth ? Scrolling looked very harsh when I implemented it
Hello sir, actually I found it pretty easy and I have a question
If I am building the entire website in MERN let's say I will write code for frontend in React js
So i just want to know can we integrate this scrolling effect in react?
Great video ! Does anybody know how we can turn a video into similar type that plays in this animation, like a timelapse, but its different than if we just drop framerate of the video.