-
Notifications
You must be signed in to change notification settings - Fork 69
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Added New "Cursor-Trail Effect" to The Website #363
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
It doesn't seem to work in the preview |
@Akshatchaube01 It is working fine, Try merging it, if it didn't work in deployment then revert it back I'll make the changes! trail.mp4 |
Okay, pull the recent changes and then I'll merge @MastanSayyad |
@Akshatchaube01 done! |
@Akshatchaube01 yeah its working but not synchronized with the cursor, I'll make the changes right away!! |
The issue we're experiencing is likely due to the way we update the position of the circles in relation to the mouse coordinates. To ensure the circles follow the cursor correctly, I need to adjust the logic in animateCircles function. @Akshatchaube01 |
Hey @Akshatchaube01 issue closes #347
I have created and added a New "Cursor-Trail Effect" to The Website as the previous one was not working properly and was lagging so much.
Changes I made:
react-animated-cursor
and created cursor trail effect using HTML CSS and JS in Reacttrail.js
file uses a radial gradient background for the circle elements.#00eaff
and#0378ff
, creating a visually appealing effect.index.html
- The
mousemove
event listener adjusts for the vertical scroll position usingwindow.scrollY.
- The circles' positions are updated in the
animateCircles
function, ensuring they follow the cursor with a trailing effect.Screen Record
trail.mp4
Please take a look and review it,
If possible please Increase the LEVEL Label as per the changed functionalities, Thank You!!