• ベストアンサー

リンク先の解説を表示させたい

リンク文字の上にポイントを合わせると、リンク先の解説(四角い枠の中に文字)が出るようになってるのがありますが、あれはどうやればいいんですか? ホームページビルダーで作っています。初心者ですみませんが、なるべく簡単に分かりやすく教えてください。

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

  • ベストアンサー
  • ittochan
  • ベストアンサー率64% (2667/4137)
回答No.6

まだ締め切ってないみたいなので InternetExplorerなら <A href="http://www.okweb.ne.jp/" title="わたしは いっとちゃんです" >ittochan</A> こうすると 複数行にできます。 (o゜▽゜)o

その他の回答 (6)

回答No.7

私もビルダーを使っているのですが、 表示させたい画像を右クリックして 属性の変更をクリック。 現れた小窓の代替テキスト欄に 表示させたい文字を入れればOKですよ。 一度試してみてください。

回答No.5

ビルダーのことはよくわからないのですが 説明をつけたいのならタグはこうです。 マウスポインタの近くにつけたいのですよね。 <A href="リンクアドレス" title="説明">文字</A> 枠を点線にしたいのなら<head></head>のなかに <style type="text/css"> <!-- .box {position:absolute;visibility:hidden;border:1 solid black;padding:3;background-color:#ffffff;overflow:hidden;} //--> </STYLE> 文字を小さくしたいのなら <style type=text/css> <!-- body,td { font-size:8pt; color:#000000; font-family:'MS ゴシック';} --> </STYLE> ↓を<body></body>の一番初めに <script language="JavaScript"> <!-- // function pop(msg){ box.style.visibility = "hidden"; width = 0; height = 0; message = msg; //窓の位置 x = event.clientX+document.body.scrollLeft+15; //左からの位置 y = event.clientY+document.body.scrollTop+15; //上からの位置 // box.style.left = x; box.style.top = y; box.innerHTML = msg; box.style.visibility = "visible"; zoom(); } //ポップアップズーム function zoom(){ //拡大 width += 20; height += 10; box.style.width = width; box.style.height = height; if(width>=150 && height>=30){ } else{ zoom_timer = setTimeout("zoom()",1); } } //ポップアップを消す function nonPop(){ box.style.visibility = "hidden"; } // --> </script><SPAN class="box" id="box"></SPAN> リンクを貼るところに <A href="リンク先のアドレス" onmouseover="pop('ここに表示させる文字')" onmouseout="nonPop()">文字</A> それとも私の勘違いでテーブルの中に 説明、ということでしょうか。 それならタグは↓です。 <head></head>のなかに <SCRIPT Language="JavaScript"> <!-- isIE4 = (navigator.appVersion.charAt(0)>=4 && (navigator.appVersion).indexOf("MSIE") != -1) isNN4 = (navigator.appVersion.charAt(0)>=4 && (navigator.appName).indexOf("Netscape")!=-1); function link_info(m) { if(m==null) m = ""; if(isIE4) { el = document.all("LINKMSG1"); el.innerHTML = m; } else if(isNN4) { lay = document.layers["PARENT_LINKMSG"].document.layers["LINKMSG1"]; lay.document.open(); lay.document.write(m); lay.document.close(); } } //--> </SCRIPT> 説明を表示させたいところに <TABLE cellspacing="1" bgcolor="#666666"> <TBODY> <TR> <TD bgcolor="#ffffff" align="center" width="77" height="20"><ilayer name="PARENT_LINKMSG" width="100%" height="20%"><layer name="LINKMSG1"></layer><span id="LINKMSG1"></span></ilayer></TD> </TR> </TBODY> </TABLE> とにかくそうゆう系は他にも色々あるので 下記のアドレスのサイトにいって 色々なサンプルを見てきて下さいw リンクを貼るところに <A HREF="アドレス" onMouseover="link_info('ここに説明')" onMouseout="link_info();">ここに文字</A>

参考URL:
http://www002.upp.so-net.ne.jp/littledear/
noname#199778
noname#199778
回答No.4

あの、テキストのリンクにポインタが載ったときに、四角い枠に解説の入ったものをポップアップさせたいということですよね? テキストのリンクにポインタが載ったときに解説を出したいときは、すでに#2の方が回答されていますが、そのタグにtitle属性を指定することで実現します。 リンクであれば、HTMLソースを以下のようにしてみて下さい。 <a href="***.htm" title="リンク先のページの解説">次のページ</a> こうすれば、リンクの上にポインタが滞在したときに、四角い解説入りの枠がポップアップするはずです。 ただし、ブラウザによっては挙動が異なる場合もあります(IEとNetscapeでは枠がポップアップするはずです)。 なお、これはリンクだけに限らず、いろいろな要素に設定できます。 <em title="ここ試験に出ます">重要事項です</em> <p title="本文です">早速ですが本題に…</p> などというような使い方もできます。 私はホームページビルダーを利用していないので、ホームページビルダーの操作法はわからないのですが、HTMLソースの編集モードがあるのであれば、そこから上記のように変数してみて下さい。 参考になれば幸いです。

  • gura_
  • ベストアンサー率44% (749/1683)
回答No.3

 #1さんのように変更すると、ホームページビルダーの「HTMLソース」画面で <img src="xxx.gif" alt="イラスト" > のように alt="イラスト" が追加されたことが確認できます。 さらに詳しくは、次のサイトを参考にして下さい。 http://tohoho.wakusei.ne.jp/html/img.htm

noname#48234
noname#48234
回答No.2

こんにちは。 >四角い枠の中に文字 というのは、マウスポインタの近くに四角い箱が現われるということですか?それとも、ブラウザのステータス欄(左下)に解説が表示されるということですか? ステータスバーならばJavaScriptでの制御が必要です。 HTMLソースを直接編集できますか? 以下、四角い箱パターンの実現方法ですが、ソース編集が分からない場合は、他の方からの回答(ビルダーでの操作方法)を待ってください。 ソースを表示して、リンク設定している部分を下記の通り編集してください。 <a href="****.html">***ページへ</a> という部分にtitle="○○さんのページです"を付け足して、 <a herf="***.html" title="○○さんのページです">***ページへ</a> としてください。 リンク文字にマウスポインタが乗ったときにポインタの近くに四角い箱が現われて説明文が表示されます。 質問文から察するに、ソース編集はちょっと無理そうなので「自信なし」。

  • master-3rd
  • ベストアンサー率35% (582/1641)
回答No.1

画像の代替テキストで出来るようです。 リンクに指定したボタン画像を右クリック→属性の変更→画像の「代替テキスト」に文章を書き込んでください。 プレビューで確認するとちゃんと出てると思いますが…

関連するQ&A