- ベストアンサー
onMouseoverで下線表示したい（リンクではないテキスト）
リンクではないテキスト部分に <a onMouseover="this.style.textDecoration='underline'" onMouseout="this.style.textDecoration='none'"> を入れるとリンクではないテキスト部分に下線がつくのですが、同じテキストに<onclick="document.all.d.style.display= document.all.d.style.display=='none'?'':'none'"> という別の場所に別のテキストを表示する支持を入れたいのですが、一緒に入れてしまうと動いてくれません…どうしたらよいか教えてください。
- katzenego
- お礼率58% (24/41)
- HTML
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
普通に↓ <a onMouseover="this.style.textDecoration='underline'" onMouseout="this.style.textDecoration='none'" onclick="document.all.d.style.display= document.all.d.style.display=='none'?'':'none'"> で動くと思いますが…
関連するQ&A
- onclickで別の場所にテキストを表示させたい
<a onMouseover="this.style.textDecoration='underline'" onMouseout="this.style.textDecoration='none'" onclick="document.all.d.style.display=document.all.d.style.display=='none'?'':'none'">★★ ～ <p ID=d STYLE="display:none">●● という★★（否リンク）ではないテキストをクリックする（オンマウスオーバーで下線表示）と別の場所に●●が表示されるという支持をHTMLで出しているのですが、これをJavaScriptで指示させる事は可能でしょうか？今のままだとネスケでオンクリックが動かないので困っております…要はネスケでもIEでも動くような指示を出したいのですが…
- ベストアンサー
- JavaScript
- onclickで別の場所にテキストを表示させたい
先程も質問させて頂いたのですが、問題にぶち当たったので再度お願いしますm(＿＿)m <a onMouseover="this.style.textDecoration='underline'" onMouseout="this.style.textDecoration='none'" onclick="document.getElementById('1').style.display= document.getElementById('1').style.display=='none'?'':'none'">★★ <p ID=1 STYLE="display:none">●● で、★★をクリックすると「別の場所にある●●」が表示されるように指示を出しているのですが、 ★★が複数あり其々表示される●●も違う、だが●●が表示される場所は同一の場所にしたい、 というのを目指しているのですが、上記の場合だと ★★1をクリックした後に★★2をクリックすると●●1がそのまま残ったその下に●●2が表示されてしまいます。 ★★1をクリックした後で★★2をクリックした時結果として●●2だけを表示させたいのですが、どうしたらいいでしょうか…？ それが5つぐらい予定しているのですが…JavaScriptで指示した方が簡単でしょうか？
- ベストアンサー
- HTML
- マウスオーバーで下線を表示させる（リンク）
<a href="リンク先" target="_blank" style="text-decoration: none;"> <font size="-1" color="405050" onMouseOver="this.style.color='#dc143c'" onMouseOut="this.style.color = '#405050'"> 文字列</a></font> というタグで、マウスオーバーで文字色が変わるように しています。 下線を常時表示させてもいいのですが、 表示させると文字が読みにくくなってしまうので、 マウスオーバー時のみ下線を表示させ、 文字色も変えるタグはないでしょうか？ 出来れば上記のようにタグに直接挿入する ものが希望です。よろしくお願いいたします。
- ベストアンサー
- HTML
- onmouseoverはCSS参照に含められるか？
<div style="color: blue;" onmouseover="this.style.color='red'" onmouseout="this.style.color='blue'">あああ</div>を、 <style type="text/css"> <!-- div { onmouseover="this.style.color='red'"; onmouseout="this.style.color='blue'; } --> </style> みたいには書けませんか？ a:hoverだったらできるのは承知していますが、 タグが<a>でなく<div>なので、onmouseover、onmouseoutを使わざるを得ず、 さらにonmouseover、onmouseoutはCSSでなくJSだと思うのですが。
- ベストアンサー
- CSS
- onMouseOverの適応範囲
困ってしまい質問させていただきます。 <div> <a href="t1.html" onMouseOver="javascript:document.all('id1').style.visibility='visible';" onMouseOut="javascript:document.all('id1').style.visibility='hidden';">show</a> </div> <div id="id1" onMouseOver="javascript:document.all('id1').style.visibility='visible';" onMouseOut="javascript:document.all('id1').style.visibility='hidden';"> <a href="image.gif" onMouseOver="javascript:document.writeln(document.all('id1').style.visibility)">イメージ</a> </div> 以上のhtmlでは、「イメージ」にマウスを持っていくと、hiddenと表示されてしまいます。 一度も<div id="id1"></div>から離れていないため、visibleと表示されると思っているのですが、<div></div>の中であっても、onmouseOutが実行されてしまうのでしょうか？ ブラウザはIEを利用しています。 どうか宜しくお願いします。
- ベストアンサー
- JavaScript
- onmouseoverを外部にまとめる
お忙しいところすいません 以下のようなマウスオーバーで背景が変わるテーブルを制作してますが、長くなるので「onmouseover」等をまとめる方法があれば教えてください。 ■---元----------------------■ <head> </head> <body> <table> <tr> <tr> <td onmouseover="this.style.backgroundColor='#ffffcc';" onmouseout="this.style.backgroundColor='#68ceff'" bgcolor="#68ceff">リンク</td> </tr> <tr> <td onmouseover="this.style.backgroundColor='#ffffcc';" onmouseout="this.style.backgroundColor='#68ceff'" bgcolor="#68ceff">リンク</td> </tr> </table> </body> </html> ■---希望----------------------■ <head> <script language="JavaScript"> <!-- td#over { onmouseover="style.background='#ccccff'"; onmouseout="style.background='#68ceff'" } //--> </script> </head> <body> <table> <tr> <tr> <td id="over">リンク</td> </tr> <tr> <td id="over">リンク</td> </tr> </table> </body> </html> -------------------------------- ＣＳＳもJavaScript初心者ですので全く的外れな質問かもしれませんがよろしくお願いします。
- ベストアンサー
- JavaScript
- onmouseoverの表示切り替えが上手くいかない
onmouseoverを使って、隠していた＜DIV＞を表示させたいと思っています。 ＜li＞にマウスが重なったら、その直前に表示させていた＜DIV＞を隠した上で、idに対応する＜DIV＞を表示させ、さらに＜H2＞に重なった場合にも隠す、という流れの処理を考えています。 firefoxのエラーコンソールでは「descriptionw0 is not defined」となって、動作しません。IEでもエラーになります。 どこかでミスをしてはずなのですが、どうやっても上手くできないので、知恵を貸していただけないでしょうか。よろしくお願いします。 -------------------------- javascript --------------------------- <script language="javascript"> <!-- var target = null; function mOver(t){ if(target!=null){ document.getElementByID(target).style.display = 'none'; } document.getElementByID(t).style.display = 'block'; target = t; } function mOut(){ if(target!=null){ document.getElementByID(target).style.display = 'none'; } target=null; } //--> </script> ---------------------------- HTML部分 ---------------------------- <div class="part"> <h2 class="title" onMouseover="mOut()">＊＊＊</h2> <ul class="article"> <li onMouseover="mOver(descriptionw0)"><a href="#">ＡＡＡ</a></li> <li onMouseover="mOver(descriptionw1)"><a href="#">ＢＢＢ</a></li> </ul> <div class="description" id="descriptionw0" style="display:none;">ａａａ</div> <div class="description" id="descriptionw1" style="display:none;">ｂｂｂ</div> </div>
- ベストアンサー
- 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」まで書かなくてはいけません、大変なので数字の部分だけ連続して番号を書けるようになるソフトはありますでしょうか？。
- ベストアンサー
- フリーウェア・フリーソフト
- CSSでリンクの表示をテキストと画像で変えたい
CSSを使って、 ・テキストのリンクのときは、 a:link で 常に点線のアンダーラインを表示 a:hover で マウスを重ねたとき色を変える ・画像のリンクのときは、 アンダーラインをださない a:hoverの動作をさせない という風にしたいのですがうまくいきません。 a:link { color: black; text-decoration: none; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333; } a:hover { background-color: black; text-decoration: underline; color:white; } といった指定をして、テキストからのリンクに適用しています。そのうえで、画像には上記の設定が生きないようにしたいと思っていますがうまくいきません。 .bordernone { border: none; } と書いて、リンクの画像に <img src="image/xx.jpg" class="bordernone" style="border-style:none"> などとしてもうまくいきません。 よろしくお願いいたします。
- ベストアンサー
- CSS
- テキストやリンクの表示・非表示
Javascriptでテキストやリンクの表示や非表示をできるようにしたいです。 基本はテキストやリンクを非表示にして、”表示”リンクを表示させ、 ”表示”リンクをクリックすると、テキストと”非表示”リンクを表示させます。 しかし下のソースで実行をすると 最初、”表示”リンクのみ表示→”表示”リンクをクリック 次、テキストと”非表示”リンクを表示→”非表示”リンクをクリック 次、全て非表示 と、なってしまい、再度表示させることができなくなってしまいます。 よい解決方法があったら教えてください。 よろしくお願いします。 ========================================================== <html> <head> <title>表示・非表示テスト２</title> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <script language="javascript"> <!--// var typ; var typ2; function setDisplay(typ,typ2){ document.getElementById("myText").style.display = typ; document.getElementById("myText2").style.display = typ2; } //--> </script> </head> <body> <DIV ID="myText" style="display:none"> Display Sample<br> <a href="javascript:setDisplay('none','blcok');">非表示</a><br> </DIV> <br> <DIV ID="myText2"> <a href="javascript:setDisplay('block','none');">表示</a><br> </DIV> <br> </body> </html>
- ベストアンサー
- JavaScript
