Q&A
この内容だと丸投げになってしまうなのでできる限り自分で調べた、やってみたことを書いてみて下さい。
前提・実現したいこと永久×バレット
初めてテラテイルにて質問させていただきます。
上記サイトのカーソルについてくる光が背景の画像に近づいたときに、その周辺を照らす技術はどうすれば再現できますか？
ソースコードを読んだのですが該当箇所がわからず悩んでいます。
皆様の知恵を拝借させてください。
発生している問題・エラーメッセージ
カーソルに追従する光が背景の画像を照らすコードを再現する方法
該当のソースコード
<canvas id="main-canvas" width="1656" height="1314" style="width: 1183px; height: 939px;"></canvas>
使用言語：HTML5, CSS3, JavaScript(jQuery)
試したこと
2021/04/27
デベロッパーツールを用いてソースコードの詳細を調べ、canvas要素が本件に関与していることがわかりました。
2021/05/02追記
・本サイトはWPのオリジナルテーマで書かれておりソースがブラックボックス化されていてソースが見れない
・polyfill.io、2Dパーティクル、2Dプロセス、webGL、openGL等の技術が使用されていること
以後調べてこの２点がわかりましたが、私は初学者のためこのアニメーション（エフェクト）を再現する技術は現状ありません。
今後学習していき見解が出次第、修正させていただきます。
補足情報（FW/ツールのバージョンなど）
ここにより詳細な情報を記載してください。
K_3578様、初めての質問で勝手が分からず失礼致しました。質問の内容修正させていただきます。
BA付けられたようですが、極力修正して次回の質問に活かして頂ければよろしいかと。
ヘルプの「質問するときのヒント」も参考にしてみて下さい。
https://teratail.com/help/question-tips
承知いたしました、ご教授ありがとうございます。
本件の主題が「実現する方法」ならば、まだクローズするべきでは無いかと思います。
miyabi_takatsukさんが回答で示してらっしゃるのはあくまでどういう要素が使われているかなので、
実現する方法を質問者さんが思いついたならばそれを自己回答で書くべきかと。
要素そのものを知りたかったというのが主題なら上のコメントは気にしないで構いませんが、
そういう風に質問書き換えていただければ幸いです。
長々と失礼しました。
回答1件
0
ベストアンサー
リンクのサイトは、canvas要素が使用されているようです。
詳しくは、canvas マウスカーソル 追従などのキーワードで検索・調査してください。
投稿2021/04/27 05:44
総合スコア9528
miyabi_takatsuk様、大雑把な質問にも関わらず適切な回答ありがとうございます。
canvas要素については初耳でした、大変ありがとうございます。
あなたの回答
tips
プレビュー
