- ベストアンサー
マウスストーカー
https://www.evoworx.co.jp/blog/mouse-stoker-gsap/ 上記のサイトを見てマウスストーカーをつけようとしたのですが 上手く出来ません 黒の点とオレンジの丸は ページの左上付近に表示はされるのですが それ以上は動かず… 直打ちもコピペでも試したのですがうまくいきません どうしたら普通に動いてくれるようになるのでしょうか? 分かる方いましたら 教えていただけましたら幸いです
- みんなの回答 (1)
- 専門家の回答
質問者が選んだベストアンサー
実験してみて、私もちょっとうまくいってないんですけど、一つ進展がありました。 まず、TweenMaxを組み込むscriptタグ、そして一般にjQueryを組み込んどいたほうがいいということなので、<head>内に次の2行を書いておきます。 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.2/TweenMax.min.js"></script> そしてcssを follow.cssファイル、jsを follow.js ファイルとかに保存してると思うんですけど、 cssの方は普通に<head>内で <link rel="stylesheet" href="follow.css"> として読み込めばいいんですが、jsの方はhead内で読み込むと動かなくて、最後の</body>の直前あたりに <script src="follow.js"></script> として読み込むと、カーソルに追従してくれました。 表示自体がうまくいっているなら、これで動くようになるかもしれません…? ----以下余談 そのページのサンプルで、followerのz-indexを1000にしておく、ってありますけど > z-indes: 1000; にタイプミスしてるんですよね…それでも動いてますが。(他の要素に隠れてしまう事が考えられます。でもサブなので影響は極小ではあります。) で、私はサブカーソル(follower)が出なくて困ってるんですけど^^; カーソルの方は動いたのでとりあえず。