ネットスケープでも見えるオンマウスの説明文
- ネットスケープでも見えるオンマウスの説明文について知りたいです。
- IEではボタンに触れると説明文が表示されますが、NNでは表示されません。
- NNでもIEでもボタンに触れて説明文を表示する方法を教えてください。
- ベストアンサー
ネットスケープでも見えるオンマウスの説明文
ボタンに触れると説明文が出て、ボタンを押すとリンク先に飛ぶというのがIEではできました。ところが、NNだと、ボタンに触れても説明文が表示されません。 NNでもIEでもできるようにすればどうすればよいのでしょうか？ <a href="リンク先のアドレス" onmouseover="txt1.style.display='block'" onmouseout="txt1.style.display='none'"> <img src="ボタンのファイル名"></a><br> <span id="txt1" style="display:none;position:absolute; color:説明文の色;background-color:white"> 説明文</span> ※ボタンを押したときに、ボタンが黒い点々で囲まれる（リンクを示すもの？）は説明文をいっしょに囲みたくないのでこうなりました。
- vivien
- お礼率77% (67/86)
- HTML
- 回答数1
- ありがとう数2
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
onmouseover="document.getElementById('txt1').style.display='block'" onmouseout="document.getElementById('txt1').style.display='none'" という風に書けば動作しました。（ただしＮＮ６以上） あと、<SPAN>の style の中で top と left できちんと位置を指定しないと、ＩＥとＮＮで文字の表示位置が結構ずれます。
関連するQ&A
- テーブルとオンマウス
<span> <a onmouseover="setSpanDisplay(this,'block')" onmouseout="setSpanDisplay(this,'none')">test</a> <span class="txt1" style="display:none;position:absolute;border:1px outset 線の色;color:説明文の文字色;background-color:#ffffe1;width=465;">ほげ1<br></span> </span> <span> <a onmouseover="setSpanDisplay(this,'block')" onmouseout="setSpanDisplay(this,'none')">test</a> <span class="txt1" style="display:none;position:absolute;border:1px outset 線の色;color:説明文の文字色;background-color:#ffffe1;width=465;">ほげ2<br></span> </span> <span> <a onmouseover="setSpanDisplay(this,'block')" onmouseout="setSpanDisplay(this,'none')">test</a> <span class="txt1" style="display:none;position:absolute;border:1px outset 線の色;color:説明文の文字色;background-color:#ffffe1;width=465;">ほげ3<br></span> </span> <span> 以前ここで回答を頂いた上記をスクロールバー付きのテーブルの中で使おうと思いましたが（少し省略してあります）問題が発生したので質問しました。 分かりづらいですが、画像で解説です。 http://www3.ezbbs.net/22/kinokokinoko/img/1185714736_1.JPG スクロールバー付きのテーブルの中の文字Aの上にマウスを置いた時に文字Cの位置、つまりスクロールバー付きのテーブルの外側に文字を出したいのです。 しかし、実際にはスタイルシートで位置を指定してもマウスを文字Aの上に置いた時、文字Bのようにスクロールバー付きのテーブルの内部に文字が表示されてしまいます。 これを最初に書いた通り、スクロールバー付きのテーブルの外側に文字を指定の位置に表示する方法はあるのでしょうか？。
- ベストアンサー
- HTML
- オンマウス
<a onmouseover="txt1.style.display='block'" onmouseout="txt1.style.display='none'">$data[1]</a> <span id="txt1" style="display:none;position:absolute; border:1px outset 線の色;color:説明文の文字色;background-color:#ffffe1;width=465;">$data[2]<br></span> オンラインマウスのサイトで上記の物を使用しています。 CGIで上記の物を使用していますが同一ページに複数あるとエラーで文字が表示されません。 「txt1」を変更すれば表示されるのは分かっているのですが、いちいち「txt1.txt2...」と変更せずに、これを同一ページに複数表示させるにはどうしたらよいでしょうか？。
- ベストアンサー
- JavaScript
- カーソルを当てると真下に説明文が来て困ってます。
<div class="sub3"><img src="○○.gif"> <a href="http:○○.html" onmouseover="txt4.style.display='block'" onmouseout="txt4.style.display='none'"> ○タイトル○</div></a> <span id="txt4" style="display:none;position:absolute; border:3px solid #ff0000;color:#FF0099;background-color:#FFFFCC;"> ○説明文○ </span> と記入したのですがカーソルを当てると説明文が 真下に来てしまいます。 右横に来るようにするにはどうしたら良いでしょうか？ なお<div class="sub3">というのは .sub3 { width: 180px; height: 8px; padding: 2px 7px 0px 0px; font-weight: bold; color: #ff69b4; font-size:11px; } という定義です。 どうしたら真下でなく横に説明文の枠が来るようにできますか？
- 締切済み
- ブログ
- スタイルシートでレイアウトしたいのですが出来ません。
<a href="○○.html" onmouseover="txt1.style.display='block'" onmouseout="txt1.style.display='none'"> ○○タイトル○○</div></a> <span id="txt1" style="display:none;position:absolute; border:3px solid #ff0000;color:#FF0099;background-color:#FFFFCC;"> ○○説明文○○</span> 上のような<txt>タグが全部で２０個以上あるので （つまりtxt1～txt20まであります） CSSでレイアウトしたいのですがうまくいきません。 上のタグをCSSでどのように定義づけたら <div class>で作れるようになるか教えてください。
- 締切済み
- ブログ
- 「カーソル当てると説明が出る方法」
<ait>や<title>でなく カーソルを当てると自分の好きな「背景色や枠色」で 説明文が出るようにしたいのですが中々うまくいきません。 そこで、あるサイトの方のソースを見て そのままタイトルや説明文章を変えてみたら表示できました。 －<a href="○○.html" onmouseover="txt1.style.display='block'" onmouseout="txt1.style.display='none'">○○タイトル</a> <span id="txt1" style="display:none;position:absolute; border:3px solid #006633;color:#ffffff;background-color:#000000;">○○説明</span> ここにあろ<span id="txt1>という物が何か分かりません。 自分でＣＳＳで<txt1>を作らないといけないでしょうか？ もし.txt1 を作るなら何を記入すれば良いのですか？ またこのまま、この方のソースをコピペして使った場合 もしこの方がサイトを閉鎖しても 僕がコピペした部分はそのまま生きていますでしょうか？ もし手直し等必要ならどうか教えてください。 このままで良いのか手直しがいるのかが分かりません。
- 締切済み
- ブログ
- 画像アイコンにリンクつけたいし、説明もポップアップさせたい
お世話になっております<m(__)m> タイトルのとおりなのですが、画像アイコンにリンクつけたいし、説明もポップアップさせたいんです。 http://rurunta.gooside.com/ ↑のページを参考にしました。作者さま、ありがとうございます<m(__)m> それぞれ、下記のようなソースで作ればいいとのことですが、 <a href="表示させたいペ－ジのURL" onmouseover="txt1.style.display='block'" onmouseout="txt1.style.display='none'">表示させる文字</a> <span id="txt1" style="display:none;position:absolute; border:線の太さpx 線の種類 線の色;color:説明文の文字色;background-color:説明文の背景色;">説明文</span> どちらも同時に使いたい場合は、どうソースを並べればいいのでしょうか？ このページに、サンプルがありましたので、このページ自体のソースを見ようかと思いましたが、フレームでつくってあるせいか、発見できませんでした。。。 あと、このソースのなかに「border:線の太さpx 」とありますが、ｐｘってなんでしょうか？
- 締切済み
- HTML
- カーソル当てると説明文出るようにしたいんです。
CSSで今ＨＰ作っています。 カーソルを当てると説明文が出るようにしたいのですが どういうタグをCSSで作ったら良いか分かりません。 <alt="○○">や<title="○○">で出るような窓ではなく 自分で[好きな背景色]にしたり出来る説明窓を作りたいのです。 例えば http://myako.net/linkjs.html ここのようにしたいのです。 あるＨＰのソースを見たら <span id="txt1" style="display:none;position:absolute; border:3px solid #006633;color:#ffffff;background-color:#000000;">○○</span> となっていたのですがこれを記入しても文字が出てきませんでした。 何をどう記入し作ったら良いのか分からないので 作成法を教えてください。 または方法を教えてくれているサイトがありましたらを教えてください。
- ベストアンサー
- ブログ
- テキスト文がhtmlであらわれてしまうのはなぜ？
テキスト文がhtmlであらわれてしまうのはなぜ？ メモ帳に以下のような記述をして、 aaa.txtとして保存しました。 html上で aaa.txtにリンクを貼りました。 html上でリンク付けしたaaa.txtを開くと、テキスト文ではなく、htmlに変わってしまいます。つまり、下の「文字にホバーをかける」が実際にホバーがかかった状態ででてきてしまうのです。 これをテキスト文だけにするにはどうしたらいいのでしょうか？ ================================================= ホバーをかける（テキストにマウスを乗せると色が変わる ） <SPAN STYLE="font-size:24pt" onMouseOver="window.event.srcElement.style.color = 'red'" onMouseOut="window.event.srcElement.style.color = 'black'"> 文字にホバーをかける </SPAN>
- ベストアンサー
- JavaScript
- 特定の場所の番号を連続して入力する方法やソフト
<a onmouseover="txt1.style.display='block'" onmouseout="txt1.style.display='none'"> 上記ので「txt1」という2つの部分だけを <a onmouseover="txt2.style.display='block'" onmouseout="txt2.style.display='none'"> <a onmouseover="txt3.style.display='block'" onmouseout="txt3.style.display='none'"> 「txt2」「txt3」と書きかえていき、今現在1200まで書いてきました。 しかし「txt10000」まで書かなくてはいけません、大変なので数字の部分だけ連続して番号を書けるようになるソフトはありますでしょうか？。
- ベストアンサー
- フリーウェア・フリーソフト
- 『オンマウスで説明文を表示』について
http://lll.s21.xrea.com/m/link/38.html こちらのURLのタグを参考にしてやってみたところ、背景が半透明になってしまうのです。 すぐ上やすぐ下に文字が書いてあるので、ごちゃごちゃになって見えなくなってしまいます。 色々いじってみましたが、どうも上手くいきません。 どなたか、何処をどう変更するのか教えて頂けませんか？ お願いします。 使用タグ↓ <SCRIPT language="JavaScript"> <!-- function up(text){ document.getElementById('te').innerHTML=text; set.style.posLeft =document.body.scrollLeft+window.event.clientX+10; set.style.posTop =document.body.scrollTop+window.event.clientY+10; document.all('set').style.display="block";} function kes(){document.all('set').style.display="none";} //--> </SCRIPT> <A HREF="○○.html" onmouseover="up('文章...')"; onMouseout="kes()">テストページ</A> <DIV style="display:none;position:absolute;filter:Alpha(opacity=70);" ID="set"> <TABLE BORDER=1 style="border-style:dotted" BORDERCOLOR="#333333" BGCOLOR="#E0E0E0" cellspacing=1 cellpadding=20> <TR><TD BGCOLOR="#FFE0E0"><SPAN ID="te"></SPAN></TD></TR> </TABLE> </DIV>
- 締切済み
- JavaScript
お礼
さっそくやってみたら、できました！うれしくて仕方ないです。 それに、位置指定のことも教えてくださって、ありがたいです。 document.getElementByIdというがどういう意味なのかわからないのですが、これから調べてみようと思います。 短時間の間に的確な回答、ありがとうございました。