Thanks for sharing your knowledge Tim really appreciate these small tutorials! I am nowhere near these levels with webflow yet but it gives me confidence and the drive to achieve these levels 🤞👏
Thanks so much! I’m so glad the micro tutorials are helpful. So much can be done with WebFlow natively and even more can be done with JavaScript in WebFlow
If you want to make the area scrollable add this after: var mouseConstraint function mouseConstraint.mouse.element.removeEventListener( "mousewheel", mouseConstraint.mouse.mousewheel ); mouseConstraint.mouse.element.removeEventListener( "DOMMouseScroll", mouseConstraint.mouse.mousewheel );
Thanks for the idea! I haven’t included anything like that in this implementation, but that’s not to say it wouldn’t be possible for other developers. I could see it being a slightly frustrating UX though if someone only meant to drag, and they click and go to a social site by mistake.
Hello! It’s part of a Google Chrome Extension I’m working on. If you right click in WebFlow and inspect, you can change the CSS of WebFlow itself, but in order to save those changes for next time you visit the site, you’d need to save it in something like a browser extension.
Yeah, it’s a little tricky because most elements in webflow’s UI don’t have classes so you have to either target their parent and then get a specific child one by one or target by each piece’s function. It’s a lot of duplicated work, targeting one by one. I have an old version of the extension public, but it’s too dark or high contrast. Hope to be able to make progress on the new one when things slow down. chrome.google.com/webstore/detail/tims-web-plugin/oggfflpobpmaaolghdfoofejdjldnnjl?hl=en
You have the best webflow tutorials, I appreciate your effort
Thanks so much!
Thanks for sharing your knowledge Tim really appreciate these small tutorials! I am nowhere near these levels with webflow yet but it gives me confidence and the drive to achieve these levels 🤞👏
Thanks so much! I’m so glad the micro tutorials are helpful. So much can be done with WebFlow natively and even more can be done with JavaScript in WebFlow
This is a life saver. Thank you.
If I wanted the objects to rotate a little bit, is there a way to go about that?
The animation works fine but now my scroll has been disabled. How do I go about fixing it?
I figured it out!
hey timothy, I am a patreon subscriber ; but do you if its possible to have circles of multiple colours?
You are the bestttttttttttttt.... hand down.....I wish I could buy patreon but thanks for the content ...I really wait for your videos
If you want to make the area scrollable add this after: var mouseConstraint function
mouseConstraint.mouse.element.removeEventListener(
"mousewheel",
mouseConstraint.mouse.mousewheel
);
mouseConstraint.mouse.element.removeEventListener(
"DOMMouseScroll",
mouseConstraint.mouse.mousewheel
);
Hi there, can you do a tutorial on draggable elements like the "stickers" in your wedding photography website?
Hello, I have a tutorial here with the full code in the video description. th-cam.com/video/Ek1ra4ozQ00/w-d-xo.html
Hi, may I know how to use to use this one as part of a preloader thing?
I love your work, thanks for sharing! 😊
Thank you!
oh my god what timing! Can each circle have a link to a separate page?
Good question! The circles can’t be clickable with this current setup though
Subbed! Great job man, keep it up :)
Is it possible to replace the circles with vector images
Only if the vectors are also circles. Different shapes would require a different implementation of Matter.js
Yessssss 🤩 thanks so much for this!
Question: would it be possible to make those circles clickable? An application I’m thinking of is like social media bubbles or something
Thanks for the idea! I haven’t included anything like that in this implementation, but that’s not to say it wouldn’t be possible for other developers. I could see it being a slightly frustrating UX though if someone only meant to drag, and they click and go to a social site by mistake.
Hey Timothy ! Great vidéo ! How can you have a different color highlight on webflow ! i would love to do that to ! ;)
Hello! It’s part of a Google Chrome Extension I’m working on. If you right click in WebFlow and inspect, you can change the CSS of WebFlow itself, but in order to save those changes for next time you visit the site, you’d need to save it in something like a browser extension.
@@timothyricks Thanks ! Love to see mire or that ! I’ve search a similar things but I didn’t know how to target the right way I think ;)
Yeah, it’s a little tricky because most elements in webflow’s UI don’t have classes so you have to either target their parent and then get a specific child one by one or target by each piece’s function. It’s a lot of duplicated work, targeting one by one. I have an old version of the extension public, but it’s too dark or high contrast. Hope to be able to make progress on the new one when things slow down. chrome.google.com/webstore/detail/tims-web-plugin/oggfflpobpmaaolghdfoofejdjldnnjl?hl=en
YEEEES!! Thank you so much!!
So great that you add sections. A lot of tuts just show on section and that makes it non-relateable when you do a full site :)
@@hcorneliusson2424 Thank you!! Yes, the harder part is making it work in context sometimes. So glad this is helpful
Thanks!