Super easy to follow along, I have one question tho and that is how you get that smooth scroll effect? When I scroll it stops instantly when I stop scrolling with my mouse wheel
why you use position fixed in every video, it is ok for single page or single container... but when we add this section in a website in center or in bottom it create so much issues, because for that time if we use any other property, animation don't work and create so much issues, a request if you use any property that instead of position fixed, that its more helpful for everyone, thanks😍😍😍😍
I don’t use fixed position out of my choice but it stays the requirement in order to achieve similar results of a particular website. I get your point but you can also remove that copy container as IT HAS NOTHING TO DO WITH THE ANIMATION. If you’re animation doesn’t work, there has to be some other issue with your code. The JS code is not touching that element at all! Thanks
this code is not working I had copied you end to end and Im having error in this 2 line let section = document.querySelector(sectionId); let preview = document.querySelector(previewId); console is keep saying that this 2 (sectionId and previewId ) are not defined
Hello Codegrid, please I'm getting an error in the console that "GSAP target null not found." and I have check everywhere everything seem fine according to how I followed the way you wrote the code any Idea where else I can look? Thank you
Haha why not! I mean can adjust the width and height of the images based on your need, not any rocket science! There’s nothing else to expect on the page to expect “responsiveness” from. Thanks
@@creaky2436 it just makes the html ugly and makes incorporating advanced CSS animations like animations from codepen difficult. Majority of the developers still prefer to use vanilla CSS/SCSS to keep things organized. There’s no reason to waste time learning tailwind anyway if you’re already pretty good with CSS.
@@Way_Of_The_Light In that case, you would use custom css in your globals.css file and use @components directive. Tailiwind standardizes css and makes things consistent across the board, easily readable once you understand the classes, and highly customizable for theming. You can develop an mvp so much faster with tw. I don't mind bloated classnames.
When ever you add your voiceover on your videos its really getting easy to understand your code 🔥🔥 keep itup bro 👐👐
Thanks brother
Amazing tutorial ideas 🙌🔥🔥
Thanks!
Hi! aesthetically correct, but you should maintain a semantic consistency of content by placing the title and image in the same container.
Okay sir!
Amazing Bro. Thanks 🔥
Thanks 🙏🏽
Excellent 🔥💯🔥
Thanks
startClipPath didn't use ???
so niceee
Thanks
Super easy to follow along, I have one question tho and that is how you get that smooth scroll effect? When I scroll it stops instantly when I stop scrolling with my mouse wheel
Try adding locomotive scroll
Please do more of nextjs + tailwindcss!
Okay sir!
goated content man!🔥
Thanks a lot 🙌🏼
why you use position fixed in every video, it is ok for single page or single container... but when we add this section in a website in center or in bottom it create so much issues, because for that time if we use any other property, animation don't work and create so much issues, a request if you use any property that instead of position fixed, that its more helpful for everyone, thanks😍😍😍😍
I don’t use fixed position out of my choice but it stays the requirement in order to achieve similar results of a particular website. I get your point but you can also remove that copy container as IT HAS NOTHING TO DO WITH THE ANIMATION. If you’re animation doesn’t work, there has to be some other issue with your code. The JS code is not touching that element at all! Thanks
@@codegrid okkkkk thanks
this code is not working I had copied you end to end
and Im having error in this 2 line
let section = document.querySelector(sectionId);
let preview = document.querySelector(previewId);
console is keep saying that this 2 (sectionId and previewId ) are not defined
Works on my end. You need to pass those into the function parameters in the later part of the code brother.
Hello Codegrid, please I'm getting an error in the console that "GSAP target null not found." and I have check everywhere everything seem fine according to how I followed the way you wrote the code any Idea where else I can look?
Thank you
Did you figure it out?
I was getting the same error, but I found out that I copied the sections and the .img classes and didn't change the 'id' numbers
Bro do you work in any comapany or are you self-employed?
Yes, 9-5
background-attachment: fixed; ?
Lol. Give it a try and see if it gives you the same results 😂
Is it responsive ?
Haha why not! I mean can adjust the width and height of the images based on your need, not any rocket science! There’s nothing else to expect on the page to expect “responsiveness” from. Thanks
omg so creative
why don't you use tailwind css for unnecessary part??
I personally don’t like it
Yeah vanilla css/scss is better
@@Way_Of_The_Light No it isn't lol. Original site uses tailwind, it's everywhere. The best css library to use at the moment.
@@creaky2436 it just makes the html ugly and makes incorporating advanced CSS animations like animations from codepen difficult. Majority of the developers still prefer to use vanilla CSS/SCSS to keep things organized. There’s no reason to waste time learning tailwind anyway if you’re already pretty good with CSS.
@@Way_Of_The_Light In that case, you would use custom css in your globals.css file and use @components directive. Tailiwind standardizes css and makes things consistent across the board, easily readable once you understand the classes, and highly customizable for theming. You can develop an mvp so much faster with tw. I don't mind bloated classnames.