A 回答 (2件)
- 最新から表示
- 回答順に表示
No.2
- 回答日時:
<IMG>タグには、onClickイベントハンドラを追加しておくとして…
座標計算の考え方としては、
(画像に対するマウスの相対座標)=(マウスの絶対座標)-(画像の左上絶対座標)
で決まります。
以下、IE限定で書きます。
マウスの座標はグローバルオブジェクト"event"のプロパティから取得できます。
------------------------------------------------------------
var mouseX= event.clientX;
var mouseY= event.clientY;
------------------------------------------------------------
タグ(Elementオブジェクト)の座標も、エレメントのプロパティから取得できます。
------------------------------------------------------------
<img id="example_img" src="sample.png">
------------------------------------------------------------
このようなタグであれば…
------------------------------------------------------------
var imgX= document.getElementById("example_img").offsetLeft;
var imgY= document.getElementById("example_img").offsetTop;
------------------------------------------------------------
で取得できます。
なお、Firefoxの場合は、EventListenerを使ってマウス座標を取得するようです。
以下の参考サイト以外にも大量に検索に掛かりましたので自分に合うものを探してください。
参考URL:IE以外のブラウザへの対応で参考にしました
参考URL:http://www.kawaz.jp/pukiwiki/index.php?JavaScrip …
No.1
- 回答日時:
JavaScriptだとこんな感じでしょうか?
テーブルの背景に画像を置くとか??
これはエリアマップで書くことも出来ます。
<img src="画像ファイル" width="380" height="345" border="0" usemap="#Map">
<map name="Map">
<area shape="rect" coords="110,137,120,142" onClick="pus();">
</map>
など
ただし1pxづつやるとエリアが莫大になります。
それかマウス位置を判定すると出来ますが、画像の配置位置によってはブラウザでずれます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- その他(プログラミング・Web制作) このプログラミングをどう組みますか? Googlecolabでやってるんですが、出来る方お願いします 1 2022/07/13 10:52
- Visual Basic(VBA) VBA 画面上のカーソルに文字数字を入力するコードを教えて下さい 1 2022/10/30 10:31
- Windows 10 フォルダアイコンをパワーポイントなどで自作するには? 2 2022/06/21 18:54
- その他(プログラミング・Web制作) uwscについて質問です。 1 2022/05/28 13:46
- Windows 8 動画の再生とタイトルの変更方法を教えてください。 3 2022/08/01 14:51
- その他(ブラウザ) テキストを入れるときの縦線の点滅がそれ以外のブラウザ上にも表れます。 1 2022/07/29 21:55
- HTML・CSS トリミングで表示した画像をクリックで元どおりにしたい 3 2022/12/16 18:49
- PowerPoint(パワーポイント) パワーポイント アニメーション効果で、テキストと同時に画像を表示させる方法を教えてください 2 2022/09/12 21:06
- フリーソフト 画像貼り付け、URLに飛べる軽いメモ帳 3 2022/05/12 07:42
- その他(プログラミング・Web制作) uwscのスクリプトの書き方について質問です。 1 2022/06/17 18:35
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Javascriptで指定した日付と時...
-
画像削除機能を付けたい
-
ボタンをクリックした時に、キ...
-
bxsliderにて読み込み後に内容...
-
Javascript で共通の処理をどこ...
-
smartRolloverのカスタマイズに...
-
スワップイメージが上手く動作...
-
画像をフォルダに入れれば表示...
-
JavaScriptでスライドショー
-
<table>、もしくは<iframe>内で...
-
javascriptのitem?klassとは?
-
textareaに画像を表示したい
-
画像をクリックしてその地点の...
-
MAX関数を使ってからLEFT JOIN...
-
jspでcssが読み込めない
-
JSPでの画像ファイル表示
-
iframe内のリンクが飛ばないの...
-
javascriptテキストBOX色を元に...
-
javascriptで複数の画像をラン...
-
javascript 時計24時間表示
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
textareaに画像を表示したい
-
JavaScript スライドの画像にリ...
-
HTMLで条件分岐はできますか?
-
画像ランダム表示、しかしダブ...
-
bxsliderにて読み込み後に内容...
-
画像を切り替えランダム表示
-
1枚の画像をクリックすると複数...
-
Gifアニメ、最後のコマに行った...
-
画像の重なりの順序を代える方...
-
小窓について教えて下さい。
-
スライダーを実装した場合、ペ...
-
スワップイメージが上手く動作...
-
USEMAPでの指定区域にマウスオ...
-
1枚の画像をクリックして複数の...
-
クリッカブルマップの一部分だ...
-
オンマウスで、画像切り替え+...
-
iframe内のリンク文字のマウス...
-
edgeでスクロールバーに色が表...
-
画像の上に画像リンクを貼る方法
-
prettyphotoの画像表示について
おすすめ情報