画像との連動によるテキストからのリンクとマウスオーバーの色変化

前へ 次へ
このQ&Aのポイント
  • ビルダー１０でＨＰ製作中の方が、画像とテキストを連動させる方法について質問しています。
  • 画像の下にテキストを表示し、テキストからリンクを作成する方法に一工夫を加え、マウスオーバー時に画像内の特定の文字の色を変える効果と、その文字自体をリンクできるようにしたいという要望です。
  • 具体的な方法について分かり難い点もあるため、詳しい方に回答を依頼しています。
回答を見る
  • ベストアンサー

画像との連動

現在ビルダー１０でＨＰ製作をしています。 自分で作った地図と、そこに位置する場所の名称を画像の下にテキストで入れてリンクするようにしています。 つまり、画像の中には「A」と入れてて、画像下にあるテキストに「A～○○○」みたいな形でテキストからリンクするようにしてます。 これに一工夫凝らして、テキストの上にマウスポインタを持っていった時に画像の中にある「A」の色が変わったり、その「A」自体もリンク出来るようにし、画像の中の「A」からもテキストからも両方からリンク出来るようにできないでしょうか。 ちょっと分かり難い表現かもしれませんが、補足などありましたら随時補足しますので、詳しい方おられましたらご回答よろしくお願いします。

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

  • ベストアンサー
noname#19206
noname#19206
回答No.1

…要点はこの２つでしょうか？ １．オンマウスで画像の一部を変更 ２．画像の中のテキストからリンク 技術的にはいずれも不可能ではないと思いますが、ビルダーでそれを利用できるかどうかはわかりません。 ビルダーがあればどんな Web ページでも作成できるわけではありませんから、 例え無理だとしても文句などは心の内に秘めるようお願い致します。 １は JavaScript を使えば可能かもしれません。 オンマウスで画像の一部の色を変えることは不可能ですから、 画像の中 A の部分に色違い A 部分の別画像を絶対位置指定で重ねれば多分上手く行くはずです。 私はやり方がよくわかりませんから JavaScript のカテゴリでご質問なさってください。 ２のほうはクリッカブルマップを利用すれば多分お望みどおりに姿になるのではないでしょうか？ http://www.tohoho-web.com/how2/cmap.htm コレに関して新しい質問をする場合は HTML のカテゴリのほうがいいかもしれません。

sasyoukei
質問者

お礼

誰も回答くれないので、ちょっと不安になってました^^; 結論は、出来ないことはないけど、ちょっと技術が必要そうですね～ 別カテゴリにて質問し直してみます。 有難うございました。

  1. カテゴリ
  2. パソコン・スマートフォン
  3. ソフトウェア
  4. ホームページ作成ソフト

関連するQ&A

  • 画像をチェンジ→もとに戻す

    ひとつのページに複数のリンクがあります すこしはなれた場所には、リンクと関係ない　画像A　がひとつあります テキストリンク０１　にマウスカーソルをのせます すると　画像A　は　画像B　と入れ替わります テキストリンク０１　からカーソルをはずします すると　画像B　は　画像A　にもどります テキストリンク０２　にマウスカーソルをのせます すると　画像A　は　画像C　と入れ替わります テキストリンク０２　からカーソルをはずします すると　画像C　は　画像A　にもどります テキストリンク０３　にマウスカーソルをのせます すると　画像A　は　画像C　と入れ替わります テキストリンク０３　からカーソルをはずします すると　画像C　は　画像A　にもどります ...................... このようなことをしたいんですが少しわがままかもしれないので、無理なら どのテキストリンクにカーソルを置いても 画像A　→　画像B　 はずすと 画像B　→　画像A こういうJavascriptを教えてください

    • ベストアンサー
    • HTML
  • フラッシュに代替テキストを入れたい

    よろしくお願いします。 現在ビルダー１０でＨＰを製作していまして、それに付属していたフラッシュメーカー３でフラッシュを製作しています。 ＨＰを作った時に、画像であれば属性を表示させて、代替テキストを入力すれば、その画像上にマウスポインタを持って行けば入力したテキストが表示されますよね。 それと同じことをフラッシュ上で出来ないのでしょうか？ ｓｗｆファイルをビルダーに貼り付けて表示させています。 詳しい方おられましたら、ご指導よろしくお願いします。

    • ベストアンサー
    • Flash
  • オンマウスで背景画像を変えたいのですが・・・

    こんばんは。 HPビルダー７を使っています。 タイトル通りなのですが、ある画像（リンクあり）の上にマウスポインタをのせた時に、初めからある背景とは違う背景に変わるようにしたいのです。 素材屋さんで見かけた事はあるのですが…。 色々と検索して挑戦してみたものの、上手くできません。 ビルダーで出来るのなら、お手数ですがその方法を教えて頂けませんでしょうか？ よろしくお願いします。

  • マウスオンで指定の位置で画像がかわる

    テーブルの左セルにある「リンク１」のテキストにマウスをのせると 右のセルの中でそれぞれ「リンク１」と「リンク2」では違う画像 （たとえば100*100ピクセルサイズのa.gifとb.gif）が表示されるJAVAを教えていただきたいのです。 同じ位置でかわるものはサンプルなどでたくさん見かけるのですが、 位置の変え方がわかりません。 よろしくお願いいたします。 <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="200"><a href="1.htm">リンク１</a> <p><a href="2.htm">リンク2</a></td> <td width="200">ここに画像</td> </tr> </table>

  • オンマウスで画像入換えするときに、マウスをのせる前に先に画像をダウンロードしておく方法

    いつもお世話になります。 さて、今回の質問ですが、ある画像にマウスをのせたときに、その画像を別の画像に入れ換えるという技がありますよね。そこで、普通にタグを書くと <img src="マウスポインタが画像にのっていないときの画像" onmouseover="this.src='マウスポインタが画像にのっているときの画像" onmouseout="this.src='マウスポインタが画像から外れたときの画像'"> ですよね。 あるいはJavaScriptを使うと <A HREF="リンク先（http://～）" onMouseOver="スクリプト名.src='マウスポインタが画像にのっているのきの画像'" onMouseOut="スクリプト名.src='マウスポインタが画像にのっていないときの画像'"><IMG SRC="マウスポインタが画像にのっていないときの画像" NAME="スクリプト名" border="0"></A> と記載しますが、どちらの方法も、マウスポインタが画像にのってから入れ換える画像をダウンロードしてしまうと思うんですが、これだと回線が遅い方ではマウスポインタをのせてから画像が入れ替わるまで時差が発生してしまいます。そうならないように、はじめから入れ換え用の画像をダウンロードしておく方法はありませんか。 文章の構成が分かりにくて申し訳ありませんが、よろしくお願いします。

    • ベストアンサー
    • HTML
  • マウスオーバーで違う画像の表示をする

    おはようございます。 ホームページビルダーを使用しているのですが、マウスオーバーで違う画像を現在ある画像の上に表示する方法をご存知の方、ぜひ教えて下さい。 例えば簡易な地図画像があり、その中で各地図上にしかけがあり、花屋さんの上にマウスがいったら花屋さんの情報がその地図画像の上に現れるような感じです。 よろしくお願い致します！！！！！

  • マウスポインタをあてるとテキストデータの色が変わるようにしたいです、、

    Dreamweaverでウエッブサイトを製作中です。テキストデータから別のページにリンクさせる時にマウスポインタをあてるとそのテキストデータの色が変わるようにしたいのです。（画像で言うと「ロールオーバーイメージ」のような機能というのでしょうか？） ご存知の方いましたらご回答お願いします。

  • 画像にリンクを張って、その画像にマウスポインタが乗ったときに画像に変化

    画像にリンクを張って、その画像にマウスポインタが乗ったときに画像に変化が現れるようにしたいのですが方法がわかりません。どなた様かご指導のほどよろしくお願いいたします。 今回画像を以下に掲載させて頂きました。よろしければ見てみてください。 http://desktop10.web.fc2.com/11.gif 上記を見て頂くと、HOMEの下に赤い線が入っています。マウスポインタを合わせたときに上記のようにしたいと考えております。よってマウスポインタをあわせないときは、赤い線が表示されないようにしたいと考えております。このような場合はどのような記述が必要なのでしょうか？ 私はhtmlには以下のような記述をしました。 <a href="http://index.html"><img src="img/test.gif" alt="ボタン" width="115" height="48" /></a> どなた様か、ご指導のほどよろしくお願いします。

    • ベストアンサー
    • HTML
  • 地図の１枚画像に複数のリンクを付けられる？

    例えば世界地図の１枚画像を載せたとします。その時、日本をマウスでクリックすれば日本用のページへ、オーストラリアを指せばオーストラリア用のページというようにリンクをさせるにはどうすれば良いでしょうか。或いは別の良い対処法はありますか。ホームページビルダーか、又はＨＴＭＬでよろしくお願いします。

  • ＣＳＳの画像のマウスオーバーの質問です

    こんにちは [画像A]にリンクをはって、マウスオーバーの時に、[画像B]に切り替わるようにしたいのですが、できません。 ドリームウィーバーのビヘイビアパネル→スワップイメージを使うとできました。 しかし、CSSを使って、マウスオーバー時に画像を切り替えたいのです。 テキストを入れて、テキストインデント、-9999でテキストを飛ばして背景に「画像A」を持ってきて、a:hoverで「画像B」をいれて、マウスオーバーを切り替える。これもできました。 しかし、 <body> <a href="#"><img src="images/gazou.jpg" width="100" height="100" /></a> </body> 　　　　　↑ このような画像のリンクにＣＳＳを使ってマウスオーバーの画像切り替えをしたいのです。 どなたか、ご存知の方教えてください。 よろしくお願いします。

    • ベストアンサー
    • CSS

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する