• ベストアンサー

画像に触れたらテキストがでるようにするには?

HPを作成しているのですが、ある画像にマウスが触れたら、コメント文が表示されるような(画像のある位置とは別のところに表示)ことはできるのでしょうか?どのようなタグを組めばよいのか、教えていただけないでしょうか。

  • jils
  • お礼率17% (10/57)
  • HTML
  • 回答数4
  • ありがとう数0

質問者が選んだベストアンサー

  • ベストアンサー
noname#810
noname#810
回答No.3

いろんな表示方法があるでしょうが、javaスクリプトは必須になりますね。エディタがDreamWeaverやホームページビルダーあたりなら簡単にできるはずですが。。。 指定の画像のうえにポインタが来たら文字が書かれてるレイヤーを非表示から表示に切り替えるjavaスクリプトなわけですが。 とりあえずサンプルを作ってみましたが、こんなのでしょうか?

参考URL:
http://www6.plala.or.jp/beamz/sample/newpage1.htm
jils
質問者

補足

サンプルまで作っていただき、ありがとうございます。 ソースを貼り付けて、なんとか考えどおりのものができました。本当に助かりました。他の皆様の意見からも得たものが多く、勉強になりました。素人なりに頑張ってみます。

その他の回答 (3)

  • msystem
  • ベストアンサー率42% (79/186)
回答No.4

IEでしかできませんが、(Netscapeではできません)テキストを表示させたい部分のタグに「title="○○"」と入れれば、Windowsで言うToolTipが出てきます。 <td title="表示だよ"> ってな感じです。

  • meke2
  • ベストアンサー率41% (16/39)
回答No.2

こんばんわー ってちょっと回答遅いかもしれませんが… おそらく下記のURLみたいな感じでいいと思いますが…どうでしょうか。 とりあえず、HTMLのタグにはコメントを表示するようなタグは無い(ハズ) なので、JavaScriptで実現することになります。 説明が無いまま作ってしまったので、もしソースを参照してわからないことが あれば補足としてまた聞いて下さいー。

参考URL:
http://members.jcom.home.ne.jp/guru-guru/sample/samp.html
  • kurio
  • ベストアンサー率29% (424/1462)
回答No.1

画像の表示の仕方はわかりますよね? <img src=...> それの応用です。↓ <img src="○○○.gif" alt="☆☆"> 「☆☆」の部分にコメントを入れてください。

jils
質問者

補足

kurio様 回答ありがとうございます。 私の質問の聞き方がよくなかったです。ある画像にカーソルを重ねると、任意の指定した場所に文字を表示するにはどのようにすればよいでしょうか?せっかく教えていただいたのにすみません。お分かりでしたらご回答お願いいたします。

関連するQ&A

  • カーソルが画像に触れたら文字説明がでる

    HPを作成しているのですが、ある画像にカーソルが触れたら、コメント文が表示されるような(画像のある位置とは別のところに表示)ことはできるのでしょうか?どのようなタグを組めばよいのか、教えていただけないでしょうか。具体的なサンプルなど示していただけるとなお有難いです。 宜しくお願いいたします。

    • ベストアンサー
    • CSS
  • 画像表示タグについて

    HPの作成初心者のものですが、画像表示タグを作成するのに画像のURLを使用して作成する方法は、知っていますが(画像のURLは、直リンクになるので直リンクを許可している素材屋さんのみ使用しています)、画像をハードディスクにダウンロードして、画像表示タグを作成する方法が分かりません。画像表示タグについて教えてくださいませんか?もし、よろしければ、画像表示タグを表示させるための例を挙げてください。

  • 画像中のある座標でマウスオーバー時にポップアップテキスト

    画像の中の任意座標にマウスをもっていった時に、マウスより少し上の位置に説明文等のテキストをポップアップ表示させ、マウスアウトでポップアップ表示を消すのに何か良い方法はありませんか? 画像はテーブルで分割していない一枚のイメージで”画像の中のある場所”はランダムです。 表示イメージはこんな感じ ●:画像中の任意の座標 -------------------------------- | ●                  | |     ココに説明文をポップアップ表示 |    ●<-(マウス)        | |             ●      | |  ●                 | --------------------------------

  • html言語で、画像とテキストを並べる場合

    以下のようにテキストと画像を並べたい場合、ソースの記述はどのようにしたら良いでしょうか?どうも、HP作成のアプリケーションソフト(FrontPageExpress、マイクロソフトワードなど)では上手くいかなくて、タグ手打ちにしてやるう!と喚いているのですが。 ---text---      ■■■■■■■■ ----------      ■        ■              ■   画像    ■              ■         ■              ■         ■              ■■■■■■■■ 両端に余白を持たせたくもあります。ソースを<blockquote></blockquote>で囲めばOK? 逆に、               ■■■■■■■■               ■        ■               ■  画像    ■               ■        ■ ---text---   ■        ■ --------   ■■■■■■■■ と表示したい場合(下を揃える)、どう記述すればいいでしょうか? なるべく簡潔なタグになるようお願いします。 あと、FrontPageExpressはタグ手打ち入力は、出来ないんでしょうか…。

    • ベストアンサー
    • HTML
  • ビルダーのインフレームらしき所に画像表示

    こんにちは! HPをビルダーで作っているものですが、個性あるHPにしようと思って タグも一緒に挿入して作っています 本題ですが ビルダーでインラインフレームを使うとその中にページが表示されますが、画像の場合は、 いちいち「ページを作成して画像を貼り付けてリンクに貼り付けてインラインフレームに表示させる」しか出来ないんでしょうか? ・画像の横などにコメントなど入れる場合はどうなんでしょうか?

  • 文字・画像の位置の指定

    こんばんは。HPを作成しようと頑張っている者です。 文字や画像を「center」などの決められた位置じゃなく、好きな位置に指定し、さらに動かないように固定したいのですが、CSSでのタグがいまいち分からなくて困っています。どなたか教えてください!初心者のため、詳しく教えてくださると嬉しいです。

  • HPで画像を表示できません

    niftyのHP作成ツール「さくさくかきあげ君」で HPをつくっているのですが、画像が表示されません。 ×がでてしまいます。 タグは合っていると思うんですが・・・。 ファイルの保存がちがうんでしょうか???

  • Gmailのリッチテキストで、画像を添付せず送る

    よくあるHTML形式のメールマガジンのようなメールを、 Gメールのリッチテキストで送ろうとしています。 メールには画像を添付しないようにしたいので、 画像はHPサーバーにアップしたものを、 <img src="○○">のタグで呼び出して表示させようとしています。 HTMLソースにはHPのタグを書く要領で書いています。 この方法で自分のアドレスに送って表示テストをしてみたんですけど、 表示には問題ないものの、テストしたときの画像が影響しているのか、 自動的に画像が添付されてしまいます。 どうすれば画像を添付しないで送ることができるでしょうか。 もしかしてGメールでは無理ですか? OSはXP、メーラーはアウトルックです。

  • 画像のアップが出来ない

    FFFTPを使って画像をUPしたのですが、HPを開くと、画像が×になっていて見ることが出来ません。自分のPCでは表示するのですが・・・ 同じようにUPした別の画像は、表示されます。 タグの記述は正しいと思います。 原因として何が考えられるのでしょうか?

  • 画像とテキストのレイアウト

    左に画像、その画像の右に複数行のテキストを、画像高さの中央に配置したいと思っています。 <table><tr><td><img></td> <td style="vertical-align:middle"> 文1<br> 文2<br> 文3<br> </td></tr></table> をテーブルを用いないでレイアウトしたいということです。 <img src="loc"> 文1<br> 文2<br> 文3<br> では、文1 のみが画像右に表示されます。 <img src="loc" style="float:left"> 文1<br> 文2<br> 文3<br> では、文全体が画像のtop位置から表示されます。 どのようにスタイルシートで指定すればいいのでしょうか?

    • ベストアンサー
    • HTML