💛 원하는 기능

https://tolv.dk/ 페이지를 클론 코딩 하던 중, 마우스 대신 보이는 작은 원이 너무 예뻐 따라하고 싶었다.

• 원형 커서
• 원의 중심점 = 원래의 커서
• anchor에 닿으면 커서의 색상 변함
• 기존의 '못생긴' 커서는 보이지 않기

📚 참고

[Dev Ed] Awesome Cursor Animation With CSS & Javascript!

https://www.youtube.com/watch?v=TpwpAYi-p2w&t=42s

✍🏻 순서

<1> HTML: 커서로 만들 div 생성

<div class="cursor"></div>

<2> CSS: div 커스텀

/* CSS */
.cursor {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #B7BA42;
	opacity: 0.7;
}

<3> CSS: position: absolute로 만듬