How To Make A Custom Cursor For Website

From today we are going to start a new challenge which is #30days30submits. where we will make something related to the web every day for the next 30 days. And today is the first submission for the challenge. Today we are going to make a fully custom cursor for our website. Hope you will like it.
👉 Source code: codepen.io/Web...
👉 #30days30submits Github repo: github.com/Sha...
Also Watch :
Make a full website with HTML & CSS: • One Page Full Website ...
HTML & CSS Landing Page : • HTML & CSS Website Lan...
Mini Project for HTML & CSS : • Responsive Website Wit...
How To Make A WordPress website : • How To Make A Professi...
Some useful Playlist :
HTML & CSS: • HTML & CSS
Elementor Tutorials (wp): • Elementor Tutorials (wp)
Elementor Speed Art: • Elementor Speed Art
Join The Community :
Our website : webcifar.com/
Facebook Page : / webcifar
Facebook group : bit.ly/fb-group...
Instagram : / web_cifar
twitter : / webcifar
Github: github.com/Web...
#30days30submits #customcursor #javascript

[@webcifar]

👉Check All Submit for #30days30submits : github.com/ShaifArfan/30days30submits

[@YashrajThakor06]

so kind of you providing this for free without taking a single penny! hats off

[@legascii]

One of the best explanation about scroll and window

[@webcifar]

Glad it helped!

[@TanvirAhmed-ur3kr]

Use e.clientX and e.clientY instead of e.pageX & e.pageY and position "fixed" instead of "absolute". Then you won't need adjustment for scrolling.

[@lesenigma2536]

thanks!

[@TheFirzoknadeem1]

Saw your comment before watching the whole video. Kudos to you!

[@kenethnjoroge5313]

I only wish I could click the like and subscribe button a thousand times coz man, you deserve it!!
Great tutorials!

[@madhusmita2207]

Good work 👍 thanks 🙏

[@anamshafiq640]

hello can you tell me how to make it responsive ..because its not mobile freindly

[@favouritejome]

Wow, this is really brilliant. I've been wondering how to do this. Thanks for the video.

[@webcifar]

Glad it was helpful! ❤

[@RahulKumar-md5ml]

thank u very much sir for providing such kind of series. Sir plz upload a series on full stack development.👍👍👍👍👍

[@aliakbar3983]

THANK U BRO I LEARN SO MUCH FROM U

[@webcifar]

You are welcome.

[@samarjamil3053]

That's so cool!

[@webcifar]

Thanks Brother 🤘

[@Shorsheyilish]

Thanks..!! Such clear explanation. I have never used Javascript yet it was so clear to understand..!

[@webcifar]

Glad it was helpful!

[@govt.job-bangladesh]

Excellent bro ....but ...one thing is missing.How can we stop it on mobile phone? Please give response ....

[@HornRaiserOfficial]

cursor is looking great, but it's hidden on header. Can you help me?

[@ldt8910]

Awesome bro thank you!!

[@omorfaruk6986]

nice video bro

[@webcifar]

Thanks

[@sarmadali77771]

Amazing explanation... I think I can learn javascript now

[@webcifar]

All the best

[@hoagaming9751]

Verry good

[@webcifar]

Thanks

[@lesenigma2536]

Thanks man.

[@webcifar]

Happy to help

[@tikka6554]

Are you a web developer? And where are you working - fiverr etc.

[@a_basic_sheep_1993]

can u explain why cursor.offsetTop - scrollY and why scrollY + fromTop ? Thank you

[@poorvagupta223]

Amazing job

[@webcifar]

Thanks!

[@selina5304]

Thanks!!!!

[@webcifar]

Welcome

[@allat1place369]

great explanation!!!!

[@webcifar]

Thank you!

[@epicgmaer26]

I know you did this like a year ago, but i'm trying to do this myself, and it seems as though i can't get the cursor to move downwards, it just gets stuck at the top of the screen. I've tried typing in the same code you put in, but it doesn't seem to work, what do i do?

[@prince3180]

I am having the same problem 😢

[@joachimeriksen8851]

Very nice tutorial man! Thank you! If you dont mind me asking, i have some problem with the cursor and the "dot" not centering with each other. Do you know what the problem may be? The arrow and the "dot" is in two different places.

[@webcifar]

make sure about the getting cursor position in the JS part

How to setup this cursor into Elementor websites ?

[@webcifar]

you can use Simple Custom CSS and JS to add the code in your WordPress website.

@@webcifar i will try this today Thanks Bro !!

[@paulovitorgalvani8092]

I 'm trying to add in elementor either , but it donsn't work. Can you help me please?

[@bhavikkhawale4362]

at
16:3 =>{
voice.stopped();
}