Hey @dram thanks for making this tutorial! I’ve always wanted to do this. I followed your steps and wanted to ask how you got your dot to expand from the center on hover. Everything else is working normally.
My cursor expands from the upper left corner of my wrapper div. I’m thinking the solution lies with my interaction setup because the cursor lines up perfectly in the idle state.
Any idea what’s causing this? I appreciate any insight thanks!
The only links that have the ix hover are the text link and the hamburger in the nav bar
It has probably something to do with the way you have your page interaction and cursor-wrapper set up. It is different from my structure. Cursor wrapper is not set to full position, interactions work not from center but from the upper left corner etc
Hi @dram! I’ve used your tutorial on my site; thanks so much!
The mouse was working great for a few months, but now the cursor is lagging behind the mouse position. I’ve played around with the xy position (all at 50) in the animation settings, and changing the smoothing doesn’t seem to affect anything. I’ve also checked that in the animation configuration itself that the elements use the correct vh/vw movement.
Thoughts?! I have to launch soon for a client and need to figure it out first.
Hey Dram, hope all is well. Awesome stuff here! My custom cursor has rendered other elements ‘unclickable’. Can you help me out here? https://stephenflynn-portfolio.webflow.io/
Hi Dram! having a big issue here and cant seem to fix. Ive implemented my cursor, it works fine but as soon as I scroll or move further down the page the cursor seems to not follow and just stays at the top of the page until i scroll back up. Its really weird and have absolutely no idea why! Any ideas?
Ah man, something so simple! lol this has literally been driving me mad, i thought it could have been down to custom code in the body but completely missed the transform. Thanks Dram! Fixed
Hi Dram, huge thanks for you guide. I was wondering if there is a way to make appear the custom cursor only on a specific section of the site that as not a specific height but is responsive and to have the normal cursor on the other parts. Also I’d ask something not crucial but there is a way to hide momentarily the cursor wrapper so I can continue clicking on the reste of the page in the designer?
if there is a way to make appear the custom cursor only on a specific section of the site
Hide the cursor by default, create “on hover” interaction for the desired section that would switch the cursor wrapper on and then off on hovering out.
there is a way to hide momentarily the cursor wrapper so I can continue clicking on the reste of the page in the designer?
One part of the tutorial mentions this. The " Making sure the cursor elements do not interfere with the interactive objects on the page" section.
Thank you @dram for this very helpful guide. Everything works well, except for the iPad Pro fix – the cursor is still appearing. Does it still work for those who applied the same method? Has something changed since 2019 regarding this code?