このチュートリアルを使用して、SVG の瞳孔をカーソルに追従させようとしています:
https://dev.to/anomaly3108/make-svg-follow-cursor-using-css-and-js-2okp
4 つの div があります:
JS は動作しているようですが、角度が正しくありません。生徒の位置が高すぎて、正しい位置に留まることはできません。
リーリー リーリー リーリー
ここでの基本的な考え方は、線要素を使用して目の回転/方向を決定するということです。線の両端と中央にマークを付けることができます。この例では、目玉がマーカーであり、マウスの位置に基づいて線の終端を更新します。
最初に概要を含む簡単な例を示し、次に完全な例を示します:
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
ここでの基本的な考え方は、線要素を使用して目の回転/方向を決定するということです。線の両端と中央にマークを付けることができます。この例では、目玉がマーカーであり、マウスの位置に基づいて線の終端を更新します。
最初に概要を含む簡単な例を示し、次に完全な例を示します: