atsuhiro-me https://blog.hatena.ne.jp/atsuhiro-me/ みーのぺーじ https://pc.atsuhiro-me.net/ CSS anime-86.com TVアニメ「８６-エイティシックス-」のウェブサイトのマウスカーソルが凝っていたので，どうやって実装しているか見てみました． トップページでマウスを移動させると，赤いような青いような円形のカーソルが追従します．よく見ると背景によって色が変わるようになっています． カーソルの html はこのようになっていました．.l-cursor__decoと.l-cursor__point にマウスカーソルの座標を javascript で書き込む仕組みのようです． <div class="l-cursor js-cursor"> <div class="l-cursor__dec… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fpc.atsuhiro-me.net%2Fentry%2F2023%2F04%2F09%2F003241" title="TVアニメ「８６-エイティシックス-」のウェブサイトのマウスカーソルについて - みーのぺーじ" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/a/atsuhiro-me/20230409/20230409001757.png Hatena Blog https://hatena.blog 2023-04-09 00:32:41 rich https://pc.atsuhiro-me.net/entry/2023/04/09/003241 1.0 100%