onmouseoverで文字サイズ変更は可能ですか？
- HTMLとJava Scriptの初心者が文字サイズの変更をしたい場合、onmouseoverを使って実現することができます。しかし、現在のコードでは文字のサイズが変わらないため、解決策を知りたいという疑問があります。
- 文字上にマウスを載せると文字が変化するタグを使おうとしていますが、現在のコードではonmouseover時の文字サイズの変更がうまくできていません。解決策を教えていただけると助かります。
- 初心者がonmouseoverを使用して文字のサイズを変更したい場合、現在のコードではサイズの変更ができていません。どのように修正すれば、期待した動作を実現することができるのか教えてください。
- ベストアンサー
onmouseoverで文字サイズ変更は可能ですか？
タグからサイトを作ってる者です。って言ってもHTMLとJava Scriptの違いすら知らない超初心者なので、このカテゴリであってるのかすら分からないですが…。 文字上にマウスを載せると文字が変化するタグを使おうと思っているのですが、載せているときとその前とで文字のサイズを変えることは可能ですか？一応書いてみたのは、 <font size="3" onmouseover="this.innerText='あ'; return true;" onmouseout="this.innerText='い'; return true;"> い </font> ここまでなんですが…こうすると「い」も「あ」も同じサイズですよね。「い」を大きめにして、「あ」は小さくしたいんです。 分かる方いらっしゃいましたら回答お願いします。解説はできるだけ詳しくしてくださると助かります…。
- haotosasa
- お礼率70% (50/71)
- JavaScript
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
fontタグはつかわないほうがよいです。 それとinnerTextもブラウザに依存するのでinnerHTMLをつかってください。 <span onmouseover="this.innerHTML='あ';this.style.fontSize='0.8em'" onmouseout="this.innerHTML='い';this.style.fontSize='1em'">い</span>
その他の回答 (1)
- akuhijrwq
- ベストアンサー率35% (381/1064)
<font onmouseover="this.innerText='あ';this.size='3'"; return true;" onmouseout="this.innerText='い';this.size='5'"; return true;"> <font size="5">い</font> </font> とりあえずなったけど、この書き方が正しいのかはわかりません。 ここを参考にしてみました。
関連するQ&A
- 文字列にオンマウスで違う文字列を表示させたいです。
こんばんは。 下記スクリプトを記述して、文字列の上にマウスが乗ると 違う文字列が出るところまでは出来たのです。 <span onmouseover="this.innerText='メニュー'" onmouseout="this.innerText='MENU'" onclick="this.innerText='メニュー'">MENU</span> 上記の場合、最初は”ＭＥＮＵ” という文字が出ていて、オンマウスで カタカナ表記になるように変ります。 ＩＥと、Slepinir では問題なく表示＆変更が出来たのですが ファイヤーフォックスでだけ、文字が変らないのです。 どうやら、ファイヤーフォックスでは未対応のスクリプトの ようなのですが、これは、どうしようも無い事なのでしょうか…？ どなたか、上記３つのブラウザで対応可能な方法を ご存知ないでしょうか。 よろしくお願いもうしあげます。
- ベストアンサー
- JavaScript
- 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を外部にまとめる
お忙しいところすいません 以下のようなマウスオーバーで背景が変わるテーブルを制作してますが、長くなるので「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
- css ファイルでまとめたい
以下の HTML タグがありますが、 style="width: 170; height: 20; border: 1px dashed yellowgreen" という行が数行書かれていて、これを id 宣言して、css ファイルにこの Style を記述したのですが、うまくいきませんでした。 どうすればいいのでしょうか？ ご教授よろしくお願い致します。 <body> <font color="black" id="menu5">MENU: </font><br> <a onmouseover="this.style.backgroundColor='#27595a'; menu5.innerText='AAAについて'" onmouseout="this.style.backgroundColor='#D9F4E1'; menu5.innerText=''" style="width: 170; height: 20; border: 1px dashed yellowgreen" href="AAA/AAA/" target="I5" onClick="return closeMenu(this)">AAA</A><BR> <a onmouseover="this.style.backgroundColor='#27595a'; menu5.innerText='BBBについて'" onmouseout="this.style.backgroundColor='#D9F4E1'; menu5.innerText=''" style="width: 170; height: 20; border: 1px dashed yellowgreen" href="AAA/BBB/" target="I5" onClick="return closeMenu(this)">BBB</a><BR> <a onmouseover="this.style.backgroundColor='#27595a'; menu5.innerText='CCCについて'" onmouseout="this.style.backgroundColor='#D9F4E1'; menu5.innerText=''" style="width: 170; height: 20; border: 1px dashed yellowgreen" href="AAA/CCC/" target="I5" onClick="return closeMenu(this)">CCC</A><BR> </body>
- ベストアンサー
- 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
- ステータスバーに。
ごめんなさい、先日似たような質問をしたのですが、締め切ってしまったので 新しく投稿させていただきます。 ステータスバーに文字列を表示する リンクにマウスを乗せたときにステータスバーに文字列を表示する どちらも単独でなら普通に使えるのですが、併用するとリンクにマウスを乗せ たとき、一瞬しか文字列が表示されません。 どうしたらいいでしょう？ タグはこんな感じで打ってます。 <HTML lang="ja"><HEAD> <LINK REL="stylesheet" HREF="design.css" TYPE="text/css"> <SCRIPT LANGUAGE=javascript> <!-- pid = window.setInterval("stats()",100); function stats() { window.status="ようこそ～" } //--> </SCRIPT> </HEAD> <BODY> <a href="○○.html" onmouseover="window.status='ＥＮＴＥＲ'; return true;" onmouseout="window.status=''; return true;">ＥＮＴＥＲ</a> </BODY></HTML>
- ベストアンサー
- HTML
- onmouseoverでセキュリティ保護
fontのタグにonmouseoverで、文字の色を変えるだけのコードを記載しました。（onmouseover="this.style.color='#ff0000'"） この時、ホームページを立ち上げたら ---------------------------------- 「セキュリティ保護のため、このコンピューターにアクセスする 可能性のあるスクリプトやActiveXコントロールを実行しないよう、 Internet Explorerで制限されています。 オプションを表示するにはここをクリックして下さい」 ---------------------------------- というメッセージが出ます。 このメッセージを出さないようにしたいのですが 何か方法はあるのでしょうか？ ちなみに、ホームページは現在はサーバーにはあげてなく、 ローカルマシンでhtmlを記載して確認してます。
- ベストアンサー
- HTML
- スタイルシートでマウスオーバーについて
<A href="link.htm" onMouseover="this.style.color='red';a.src='r.gif' ;return true;" onMouseout="a.src='w.gif';this.style.color='lightcoral';" target="_blank"> <IMG SRC="w.gif" border="0" name="a"><font size="5">リンク</font></A> マウスを乗せる前に、フォントの色をリンクする前もした後もlightcoralにしたいのですが、 他の文字はリンク前リンク後を黒のままにしたいんです。 <font size="5" color="lightcoral">と記述すると、マウスを乗せても色が変わらなくなるので、どうしようかなと思っています。 よろしくおねがいします。
- ベストアンサー
- HTML
- リンクにカーソルを合わせると文字が変わる方法
FC2ブログを使っています。 プラグインのリンクにカーソルを合わせると文字が変わる方法を教えてください。 自分で調べると下のようなものを見つけました。 <html> <head> <title>マウスが重なったら文字のスタイルを変える</title> <script Language="JavaScript"><!-- function change(o,v) { if (navigator.userAgent.indexOf("Firefox") > -1) { o.textContent = v; }else{ o.innerText = v; } } // --></script> </head> <body bgcolor="white"> <a href="#" id="myText" onMouseover="change(this,'Hello World !!')" onMouseout="change(this,' マウスを乗せて')">マウスを乗せて</a> </body> </html> この方法でおかしな点はないでしょうか？ ブログが重くならないでしょうか？ おかしな点や他の方法などありましたらご教授お願いします。
- ベストアンサー
- ブログ
- onmouseoverに複数の命令を書き込みたい
こんにちは、初心者の質問です。 画像Aにカーソルを乗せると、別のところにある画像Bが違う画像に変化するようにJAVASCRIPTを使ってスクリプトを書きました。これはうまく作動します。 さらにこの画像Aも（画像A自身にカーソルが乗った時に）別の画像に変化するようにしたいのですが、うまくいきません。 画像Aの記述は以下のようになっています。 <img src="pic1.gif" width="50" height="30" onMouseOut="changeImg(photos[6])" onMouseOver="changeImg(photos[0])"> onmouseoverに "this.src='マウスが触れた時に表示したい画像のアドレス'" を追加したいのですが、いかんせん画像Bを変化させるためのスクリプトがすでに書き込まれています。 そこで質問ですが、onmouseoverに複数の命令を書き込むことは可能でしょうか？またそれが不可能な場合上記のようなギミックを作る最善の方法や、解説のあるサイト等を教えていただけるとありがたいです。 詳しい方、よろしくお願いします
- ベストアンサー
- HTML
