- ベストアンサー
文字列にオンマウスで違う文字列を表示させたいです。
こんばんは。 下記スクリプトを記述して、文字列の上にマウスが乗ると 違う文字列が出るところまでは出来たのです。 <span onmouseover="this.innerText='メニュー'" onmouseout="this.innerText='MENU'" onclick="this.innerText='メニュー'">MENU</span> 上記の場合、最初は”ＭＥＮＵ” という文字が出ていて、オンマウスで カタカナ表記になるように変ります。 ＩＥと、Slepinir では問題なく表示＆変更が出来たのですが ファイヤーフォックスでだけ、文字が変らないのです。 どうやら、ファイヤーフォックスでは未対応のスクリプトの ようなのですが、これは、どうしようも無い事なのでしょうか…？ どなたか、上記３つのブラウザで対応可能な方法を ご存知ないでしょうか。 よろしくお願いもうしあげます。
- sibazuke
- お礼率90% (97/107)
- JavaScript
- 回答数1
- ありがとう数3
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
innerTextはIEの方言です。 innerHTMLにすれば問題なくいけるはずです。
関連するQ&A
- オンマウスで画像を変えたい。
オンマウスで画像を変えたいのですが、 ------------------------------------------ <img src="画像１URl" onmouseover="this.src='画像２URl';" onmouseout="this.src='画像１URl';"> ------------------------------------------ や、 ------------------------------------------ <script> var src1="http://img.yahoo.co.jp/images/phonebook/jp_pb.gif" var src2="http://i.yimg.jp/images/news/yjnews.gif" </script> <img src="http://img.yahoo.co.jp/images/phonebook/jp_pb.gif" onMouseOver="this.src=src2" onMouseOut="this.src=src1" /> ------------------------------------------ など。 どれを使っていいか分からず困っています。 これぞ、っていうタグがあったらよろしくお願いします。
- ベストアンサー
- HTML
- それぞれにオンマウス動作
下記のタグで memberのオンマウス動作はできましたが、 live scheduleのオンマウス動作が分かりません。 （live scheduleもmemberとおなじようにそれぞれ独立してフェードインで出現させたいのです。） 色々試しても、オンマウスで同時にフェードインしたり、両方とも動かなくなったりでどうしたらいいか分からなくなりました。 教えてください。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title></title> <style type="text/css"> <!-- p { font-size: 50px; font-family: "MS PMincho"; text-decoration:none; } --> </style> <SCRIPT LANGUAGE="JavaScript"> <!-- // itv = 50; // cnt = 0; function strFade(str) { c = str.charAt(cnt++); document.all["ID"].style.color = "#"+c+c+c+c+c+c; if(cnt < str.length) setTimeout("strFade('" + str + "')",itv); if(cnt == str.length) cnt = 0; } //--> </SCRIPT> </head> <body> <div> <p style="margin-top: 200px;"> <p><b> ｍ </b></p> </div> <p style="margin-top: -20px;"> <p><span onmouseover="this.innerText=' liｖｅ ｓｃｈｅｄｕｌｅ'" onmouseout="this.innerText=' i'"> i </span></p> <p style="margin-top:-130px;"> <font color='#ffffff'> <SPAN id="ID"><span onmouseover="strFade('fedcba9876543210')" onmouseout="strFade('0123456789abcdef')"><p><a> ｍｅｍｂｅｒ</a></p></SPAN><BR><BR></font> </BODY> </HTML>
- 締切済み
- JavaScript
- オンマウスで画像を別の場所に表示する
過去ログで似たようなのがあったのですが、 全然わからなかったので、質問しました。 文字オンマウスで、画像を別の場所に表示したいのですが・・ (java～を使わなくてもよいやり方が知りたいです。 java～は使ったことがない初心者ですので。) ちなみに、画像オンマウスで文字を別の場所に表示するのは、 ↓このやり方(html)でできたんですが・・・ <span ID="msg">ここに表示される</span> <a href="ページＵＲＬ"onMouseOver="msg.innerHTML='表示される文字'"onMouseOut="msg.innerHTML=''"><img src="画像ＵＲＬ" border="0"></a>
- ベストアンサー
- HTML
- onmouseoverで文字サイズ変更は可能ですか？
タグからサイトを作ってる者です。って言ってもHTMLとJava Scriptの違いすら知らない超初心者なので、このカテゴリであってるのかすら分からないですが…。 文字上にマウスを載せると文字が変化するタグを使おうと思っているのですが、載せているときとその前とで文字のサイズを変えることは可能ですか？一応書いてみたのは、 <font size="3" onmouseover="this.innerText='あ'; return true;" onmouseout="this.innerText='い'; return true;"> い </font> ここまでなんですが…こうすると「い」も「あ」も同じサイズですよね。「い」を大きめにして、「あ」は小さくしたいんです。 分かる方いらっしゃいましたら回答お願いします。解説はできるだけ詳しくしてくださると助かります…。
- ベストアンサー
- JavaScript
- テーブルとオンマウス
<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
- オンマウスでテキスト変化
オンマウスでテキスト表示でこまっておりまして、yamabejpさんの以前のソースをみつけ実効してみましたが 下記(\'文章を変更する\')の箇所の文章にＣＳＳで太字にしたり、マージンしたりしたいのですが どのように書き換えればできますでしょうか。。 初心者ですみません。<script language="javascript"> function textChange(id,text){ document.getElementById(id).innerText=text } </script> <img src="nodata" width="100" height="100" onMouseOver="textChange('text1','文章を変更する')"><br> <span id="text1">このへんに文書</span>
- 締切済み
- 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
- テーブルにオンマウスで文字色を変える方法を教えてください。
当方HPビルダーV9でHP作成中です。 最近やっとCSSなど使えるようになってきたので、様々試しているのですが、どうしても自力で実現できないため、知恵を貸してください<(_ _)> テーブル内に表示されている文字を、文字ではなくて周囲のテーブルにオンマウスで文字色を変更したいのですが、どのようなタグを組めばいいのでしょうか？ 該当部分には、上記の他に、テーブルにオンマウスでテーブルの背景色を変えるタグも組み込んでいます。 以下該当部タグです。 <TABLE style="filter:Alpha(opacity=40)"bgcolor="#f75563" width="100" height="100" cellpadding="0" cellspacing="0"> <TBODY> <TR> <TD align="center"onmouseover="this.style.backgroundColor='#ffffff'"onmouseout="this.style.backgroundColor='f75563'"><FONT color="#ffffff" size="-1">bulletin board</FONT></TD> </TR> </TBODY> </TABLE>
- ベストアンサー
- ホームページ作成ソフト
- オンマウスで流れる文字
「リンクがはってある文字列があり、マウスのポインタを リンクの上にもっていく(onmouseover、a:hover状態)と文字列が左に流れる」 という仕掛けをしたいのですが、方法がわかりません。 携帯でいうところの(au限定)「<div style="white-space:nowrap">オンマウスで文字が流れます</div>(参考サイト…http://htmlcssdesign.no-mania.com/Entry/3/)」状態をPCサイトで表現したいです。 ブラウザが限定されも良いので何か方法はないでしょうか？ たとえば、 「<marquee onmouseout=this.stop() onmouseover=this.start()>～</marquee>」を指定しておいて、ページ読み込み時に全Marqueeをストップさせるとか考えたのですが、 恥ずかしながらJavaScriptがあまり詳しくなく、かなり検索してますが 「全Marqueeをストップさせる」方法自体がどうしてもわかりません。 第一「Marquee」ですと、枠の一番右から始まってしまい 「すでに文字列が表示されていて、 マウスを上にもっていくとそのまま左に動き出す」 という形になりません。 「動いてる文字列を止める」というのは沢山見つかるのですが、 「止まっている文字列を動かす」が全くみつかりません。 《html》 <div id="box"> <ul> <li><a href="#">長ーーい文章。長い文章。長い文章。長い文章の終了。</a></li> <li><a href="#">長ーーい文章2。長い文章。長い文章。長い文章の終了。</a></li> <li><a href="#">長ーーい文章3。長い文章。長い文章。長い文章の終了。</a></li> <li><a href="#">長ーーい文章4。長い文章。長い文章。長い文章の終了。</a></li> <li><a href="#">長ーーい文章5。長い文章。長い文章。長い文章の終了。</a></li> </ul> </div> 《CSS》 *{marign:0; padding:0;} div#box{ width:200px; overflow:hidden; } div#box li{ white-space:nowrap } === 上記でいうと、リンクのはられてる文字列「長ーーい…長い文章の終了。」の上に マウスをもっていくとすこしずつ左に流れ始めるイメージです。 何卒よろしくお願い致します。
- ベストアンサー
- JavaScript
- 文字を交互に変化させたいのですが…
文字変化タグについて質問があります。 クリックすると文字が変わる、というタグは分かるのですが （<span onClick="this.innerText='文字2'">文字1</span>） クリックして文字2に変わった後、もう一度クリックすると文字1に戻るというのは不可能でしょうか? 1、2、1、2とエンドレスで変わるようにしたいのですが… 分かる方いらっしゃったら教えていただけると嬉しいです。
- ベストアンサー
- HTML
お礼
yambejpさま。 こんばんは！！ いつもご指導ありがとうございます。 ご指導の通り、ＨＴＭＬに変更いたしましたら 問題なくファイヤーフォックスでも表示できました！ 本当に、ありがとうございました。