Need to mention: Keep using translate3d over translateY as it does provide better performance. Thanks to @TheDjTotzy & @lorem ipsum for the info.
@venkateshy6273 жыл бұрын
quick question window size (height of the body) is not updating when i open different inner links? unless i resize it
@venkateshy6273 жыл бұрын
when i use routes height is not refreshing, like how your website does.what you have done man... let me know..
@venkateshy6273 жыл бұрын
@Izaiah Seth so you don't knw the answer
@KIKOmanasijev4 жыл бұрын
This is f**king premium quality content!!! I've never seen any course on Udemy or any other educational platform built such amazing projects. You deserve a lot more attention.
@WrongAkram4 жыл бұрын
Man you spittin straight fax 📠
@weirdscintillatingvedios2122 Жыл бұрын
Saved me. I was developing my portfolio, and these GSAP people made the Smooth Scroll feature a paid service now. Because of you, I could implement, smooth scroll myself thank you.
@kyryloren4 жыл бұрын
love the tutorials. you’ve gotten so much more comfortable on camera, can’t wait to see you fly high 👑
@WrongAkram4 жыл бұрын
Thanks! Glad you noticed :) looking to keep improving
@TheDjTotzy4 жыл бұрын
Hey Akram really cool videos, I just wanted to point out that using the translate3d is a good idea when you want to leverage the CPU since it's using GPU driven animation. Keep up the good work bro !
@WrongAkram4 жыл бұрын
Thanks, you are absolutely right! Just checked it out :)
@adarshgoldar4 жыл бұрын
Really waiting for this smooth scrolling tutorial, and finally, you made it 😍 . Thanks for this 🙌
@WrongAkram4 жыл бұрын
My pleasure 😊
@jafetl.ch.89614 жыл бұрын
I love tour tutorials and projects. 🙌🏼
@WrongAkram4 жыл бұрын
WOW Thank you!!!!
@chokdeesam23654 жыл бұрын
The best channel ! Thank you my friend !
@WrongAkram4 жыл бұрын
Thank you so much!
@RahulSharma-ox6se4 жыл бұрын
This was super helpful, Akram. Thanks for the video
@vladimirlopez6005 Жыл бұрын
It's the best content I've ever seen, thanks!
@MiserableDuck954 жыл бұрын
Hey! Awesome tutorial as always. Question, does the app ref have a purpose? It looks like it's unused in the tutorial.
@matthewao4 жыл бұрын
Holy subbed in a heartbeat. You’re on your way to 100k bro this is 👌🏼
@florentinw4 жыл бұрын
Hi, thanks for all those great framer motion tutorials! which camera setup are you using for the moderation shots?
@WrongAkram4 жыл бұрын
Thanks! The camera I am using is the Cannon m50 with the Sigma 16mm 1.4
@OBnoxiousXBOX4 жыл бұрын
Hey man! Really appreciate the content . Have just got in to react and what you are creating is inspiring. Keep it up!
@venkateshy6273 жыл бұрын
quick question window size(height of the body) is not updating when i open different inner links? unless i resize it
@prateeksharma43274 жыл бұрын
impressive tutorial bro ... keep up the good work
@WrongAkram4 жыл бұрын
Glad you liked it
@everflavor133 жыл бұрын
Hi! Akram. I really appreciate all your lectures. I have some questions regarding performance optimization. I think we should use cancelAnimationFrame function when scroll movement stopped then call requestAnimationFrame when the scroll event triggers again. Isn't it? When we console data values inside skewScrolling function, seems there are unnecessary computing for setting data values. I just want to hear your opinion. Thanks, again.
@КомпанияВиалент4 жыл бұрын
U're just great speaker, great content. I hope to see more videos like this from you, I wish you rise high with a subscribers number. Good luck.. you're cool!
@WrongAkram4 жыл бұрын
I hope so too!
@thabangcreates4 жыл бұрын
I died at "arg fxck this place ... I sound bitter huh" 🤣🤣🤣😭💀
@WrongAkram4 жыл бұрын
lol
@williamjunior55534 жыл бұрын
Best tutorial available on KZbin. Thanks mate 👍
@WrongAkram4 жыл бұрын
🤩 glad you think so!
@rodrigogama14 жыл бұрын
Great work! Your tutorials are really impressive!
@WrongAkram4 жыл бұрын
Thanks, that really means a lot!
@hugomeireles60204 жыл бұрын
Nice work, One question. Why you don´t cancel animation on effect? is not necessary?
@WrongAkram4 жыл бұрын
Are you referring to a clean up function in the useEffect?
@hugomeireles60204 жыл бұрын
@@WrongAkram yes, because when I don´t clean up the function sometimes the animation has an issue, but in general nice work, keeps going on the nice job.
@Ihatetomatoes4 жыл бұрын
Great stuff Akram, keep it up👍
@WrongAkram4 жыл бұрын
Thank you 🙌
@navinjetha3 жыл бұрын
This is amazing! Just wondering how to change this into a horizontal scroll...do you have a tip on this?
@da.b31022 жыл бұрын
Great tutorial! thank you very much!
@tehArgento2 жыл бұрын
Great video, how would i reset scroll position on reload because it's just taking me back to the last position i was in even though i use window.scrollto(0,0). Problem doesn't happen on Firefox but it does on chrome
@joetaylor61174 жыл бұрын
This is great but the function doesnt unmount when changing page
@guillaumedumez50333 жыл бұрын
did you find a solution ? :/
@safsafaf28383 жыл бұрын
yo thats clear af
@shujaa4 жыл бұрын
Hey love this great content but the page brakes when you are transitioning to another page it gives an error that the scrollContainer is null
@peymanta89234 жыл бұрын
Awesome Tuts, Thank you sir.
@mohamedboularas64803 жыл бұрын
keep it going yuor tuto's ar amazing ❤️❤️❤️❤️
@UncleNabs4 жыл бұрын
Love the tutorials as always! Went over to his site. Would there ever be tutorials on web gl masks
@ABDULMANAN-el8gr4 жыл бұрын
Hey Akram. Hope you are doing great May you please do a video over the Fundamental Architecture Of React 🙃
@ks-op8pe4 жыл бұрын
Awesome! Thanks!
@sarthakdandotiya4 жыл бұрын
Keep these lit tutorials coming...
@WrongAkram4 жыл бұрын
Will do!!
@ayanluap4 жыл бұрын
can u plz.. make a tutorial of how to use full-calender library in react and customize it in our own way... Btw i already learned a lot of cool animation stuffs from ur videos... I m so glad that i found ur channel❤❤
@pebbles72272 жыл бұрын
it works well but whenever I click on any anchor tag on the page and if it linked to any element in the page the page breaks
@Tyler-zb6ec Жыл бұрын
Im getting: "ReferenceError: window is not defined" in the useWindowSize hook any thoughts on why? Using Nextjs btw
@alldesigncode4 жыл бұрын
This is very good!
@kerovinvillegas64024 жыл бұрын
Thanks for this but I wanna know the reason behind the values on computing the skewConfig like why 100? Thanks again
@bernardopapini3 жыл бұрын
Amazing tutorial! But using this solution, I can't positioned fixed any element (like a navbar or a "back to top" button, for example). How can I use in this case?
@abhayrohit3 жыл бұрын
Either have the Element outside the scroll container or just add Scroll Event Listener and set the item's left and top coordinates as offsetX and offsetY
@TheSldsnake4 жыл бұрын
Men u are my hero !
@WrongAkram4 жыл бұрын
;)
@mdyousufgazi40304 жыл бұрын
epic! loved it
@junaidtariq45474 жыл бұрын
Ihatetomatoes mention you in recent video and he advice you to remove the wrong akram and just put akram by the way your all tutorial are awesome and thanx buddy 😍
@Ihatetomatoes4 жыл бұрын
Haha, yes you are right I would rename it 😂
@junaidtariq45474 жыл бұрын
@@Ihatetomatoes 😂😂
@Ihatetomatoes4 жыл бұрын
@Sentinel haha, is this a contest for the worst channel name? Maybe we would be the finalists :)
@srdesigns7258 Жыл бұрын
Hi, Is still that applicable on Webflow ? If yes, how ?
@sakshamkapoor59054 жыл бұрын
Thanks man, this is lit ❤
@WrongAkram4 жыл бұрын
Glad you like it!
@sakshamkapoor59054 жыл бұрын
@@WrongAkram hey man, just 1 question, why is it lagging(in my browser atleast)? is it because it calls skewScrolling() recursively or something?
@RedVelocityTV4 жыл бұрын
You are THE best
@francomm26624 жыл бұрын
World best Akram
@WrongAkram4 жыл бұрын
Thank you!
@dimtodim3 жыл бұрын
whitch video is about timeout getBoundingClientRect???
@mohammedfaris53263 жыл бұрын
react intersection observer not working with skew scrolling
@thomsjel2 жыл бұрын
is this possible in next js? because of ssr
@koko08080084 жыл бұрын
Thank you again for this great tutorial again. Is it me or scroll to with link anchors doesnt work with this solution ?
@davetodream4 жыл бұрын
Don't suppose you managed to fix this?
@koko08080084 жыл бұрын
@@davetodream i prefer to use locomotivScroll
@davetodream4 жыл бұрын
@@koko0808008 Thanks I'll check it out.
@godwinebikwo65443 жыл бұрын
how does one handle accessibility with this?
@roobs4563 жыл бұрын
This keeps running even when the page isn't being scrolled. Not sure if there's a way around this..
@naufalfarras18024 жыл бұрын
Hi Akram, appreciate your videos! These are seriously premium, but do you mind to create similiar content like this for non react project?
@WrongAkram4 жыл бұрын
For sure!
@typescripter3 жыл бұрын
18:35 thank you ! but using translate3D is more good in performance cuz it use GPU ! not CPU ! so , apple use as well when just move one direction
@spencershrek14913 жыл бұрын
Is there an easy way to make these image elements clickable? Was thinking of having a set of carousels with a similar effect, but the elements don't seem clickable once this is implemented :thinking
@dinosantic86713 жыл бұрын
remove ''pointer-events: none;'' from css file
@spitechinthanathatset6494 жыл бұрын
Epic!
@WrongAkram4 жыл бұрын
kzbin.info/www/bejne/oKOrcmmAodeCfqc
@LbzeyroX3 жыл бұрын
how can i do this on click ?
@grandpaK420 Жыл бұрын
can someone link me the project for the debounce function he talked about at 11:25 thanks :) awesome video btw!
@StarCourtesan4 жыл бұрын
Hey which video has the debounce thingy?
@WrongAkram4 жыл бұрын
Awwwards Rebuilt Episode 2
@StarCourtesan4 жыл бұрын
@@WrongAkram Thank you so much
@darkristy4 жыл бұрын
I just added this to my nextjs site but whenever you change routes it keeps the previous height that was set from previous page. Anyway to fix that?
@WrongAkram4 жыл бұрын
I would reset the state or in our case the configs current back to 0 so it restarts from the top.
@darkristy4 жыл бұрын
@@WrongAkram so how would that look exactly because im thinking of on routechangecomplete set current back to zero, i did that but no difference. I must be missing something here.
@venkateshy6273 жыл бұрын
hey did you find any reason for that, because i got the same issue.. please help me out?
@darkristy3 жыл бұрын
@@venkateshy627 I gave up and ditch the hook he created and used resize-observer, here's a good example utilizing react-spring someone made, codesandbox.io/s/react-spring-smooth-scrolling-tfwv0
@davetodream4 жыл бұрын
Has anyone worked out how to make links clickable using this?
@dinosantic86713 жыл бұрын
remove ''pointer-events: none;'' from css file
@timeticks46253 жыл бұрын
Does somebody has also a problem with the viewHeight ? - it´s scrolling far over my content above, I don´t get it why...