初期表示を変えるには？
- タグでオンマウスでフェードイン、離れればフェードアウトの設定にする初期表示方法について教えてください。
- 初期表示を文字が隠れた状態にする場合の方法を教えてください。
- 初期表示を変える方法について教えてください。
- ベストアンサー
初期表示を変えるには？
下記のようなタグで、オンマウスでフェードイン、離れればフェードアウトの設定にしたいのですが、文字が隠れた状態が初期表示にする場合はどうしたらいいんでしょうか？？ 簡単なことかもしれないですが、どなたか教えてください。 <SCRIPT LANGUAGE="JavaScript"> <!-- // itv = 100; // 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> <SPAN id="ID"><span onmouseover="strFade('fedcba9876543210')" onmouseout="strFade('0123456789abcdef')">ｍ</SPAN><BR><BR> </BODY>
- taku6215
- お礼率66% (2/3)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
一応出来るんですが、面倒です（＝－＝； 具体的には 前文字のみの"a"文字と全体文字"amm"を用意し、 (1)起動時に"amm"を非表示にする。 (2)"a"のイベントの際に、"a"文字を非表示に変更。"amm"文字を表示状態に変更 (3)イベント終了時に、"amm"文字を非表示に変更。"a"文字を表示状態に変更 のような事を行います。 面倒ですが、"a"と"mm"で分けて処理をするやり方をすると、 "a mm"みたいな隙間が出来てしまうため、表示非表示の切り替えをしています。 （例） <html> <SCRIPT LANGUAGE="JavaScript"> <!-- // itv = 100; // 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;document.all["ID2"].style.display="inline";document.all["ID"].style.display="none";} else {document.all["ID2"].style.display="none"; document.all["ID"].style.display="inline";} } function init() { document.all["ID"].style.color = "#ffffff"; } //--> </SCRIPT> </head> <BODY onload="init();"> <SPAN id="ID2" style="display:inline”><span onmouseover="strFade('fedcba9876543210')" onmouseout="strFade('0123456789abcdef')">a</SPAN> <SPAN id="ID" style="display:none”><span onmouseover="strFade('fedcba9876543210')" onmouseout="strFade('0123456789abcdef')">amm</SPAN><BR><BR> </BODY> </html>
その他の回答 (1)
- akanekor
- ベストアンサー率52% (102/194)
文字色を初めから白くするのでしたら、 <font>属性で囲って色付けしちゃうか。 (例) <font color='#ffffff'> <SPAN .......> </font> 初期動作時にフォント色を付けるコードを書く （例） <BODY onload='init();'> function init() { document.all["ID"].style.color = "#ffffff"; } お好きな方をどうぞ。 背景色が白以外なら、それに合わせて色コード変えてくださいね。
お礼
できました！！すごい！！ めっちゃ分かりやすかったです☆ ありがとうございます！！！ ほんと感謝します！！！ すみません、もう一つなんですが、 たとえば、文字の部分が「amm」だったとして 初期画面ではaだけ表示され フェードインするとammになり フェードアウトするとaだけ残る といったことはできるのでしょうか？ 本当にありがとうございました！！！！！
関連するQ&A
- それぞれにオンマウス動作
下記のタグで 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
- 文字をフェードインするHTML教えて下さい
infoseekで勉強しながら会社のHP作ってますが、 文字をフェードインする方法が上手くいきません。 <script language="JavaScript"> <!-- count=0; Num=1; Time=100; function FadeIn(str){ c=str.charAt(count++); for(i=0;i<Num;i++){ document.all["Fade"+i].style.color="#"+c+c+c+c+c+c; } if(count<str.length){ setTimeout("FadeIn('"+str+"')",100); } } //--> </script> 次に、<body>タグ内を<BODY onload="FadeIn('fedcba9876543210')" >と変更すると、JAVAスクリプトの準備は終了になります。 後は、フェードインさせたい文字を、<span id="Fade0">文字列</span>と設定します。これで、文字がじんわりとフェードインして現れます。 上記はサンプルのコピーで、固定のバナーの下にHPへようこそ！という文字がフェードインします。 なのですが、どの部分がバナーのHTMLか、文字のHTMLか分からなく、 ＞＞、<span id="Fade0">文字列</span> この意味もわかりません。表示したい文字を「文字列」に置き換えれば良いのですか？？そしてこの一文をどこに組み込めば良いのかもわかりません・・・。 何度かやってみましたがエラーになってしまいます。 他の方法でも良いので、お解かりになるかた宜しくお願いいたします！
- ベストアンサー
- ホームページ作成ソフト
- このタグはグラデーションですが、文字が小さくて困っています。
<html> <head> <title>文字にグラデーションをかけ１文字ずつ出力する</title> <script Language="JavaScript"><!-- str = "■■■■■■■■■■■■■■■■■■■■■■■■■■"; count = 0; function setText1() { if (count > str.length) return; count++; txt = str.substring(0,count); txt2 = gradTextConv(txt); if (document.all) document.all["outText"].innerHTML = txt2; if (document.layers) { document.layers["outText"].document.open(); document.layers["outText"].document.write(txt2); document.layers["outText"].document.close(); } setTimeout("setText1()",100); } function gradTextConv(sText) { p = 16 / str.length; str2 = ""; for (i=0; i<sText.length; i++) { pt = Math.floor(p*i); n = "0123456789ABCDEF".charAt(pt); c = "#"+n+n+"0000"; str2 = str2 + "<font color='"+c+"'>" + sText.charAt(i) + "</font>"; } return str2; } // --></script> </head> <body bgcolor="white" onload="setText1()"> <div id="outText" style="position:absolute;top:50px;left:5px;"></div> </body> </html>
- ベストアンサー
- HTML
- setTimeout関数の使用方法について
はじめまして。 質問があります。 以下のコードを実行すると、一定時間おきに文字の表示が変化する ように動いてくれません。何が問題なのかがまったく見当がつき ません。どなたかご指摘をお願いします。 ---------------------------------------------------------------- <html> <head> <title>setTimeout()関数の使用例</title> </head> <body onLoad="timer=setTimeout('changeChar()',500)"> <script type="text/javascript"> <!-- var str = "abcdefghijklmnopqrstuvwxyz0123456789"; var cnt = 0; function changeChar() { clearTimeout(timer); ch = str.charAt(cnt++); document.write(ch); if(str.length > cnt) { timer = setTimeout("changeChar()",500); } } //--> </script> </body> </html> ----------------------------------------------------------------
- ベストアンサー
- JavaScript
- このタグが繰り返しにならないでしょうか？（今は、一度で終わります。）
このタグが繰り返しにならないでしょうか？（今は、グラデーションが一度で終わります。） <html> <head> <title>文字にグラデーションをかけ１文字ずつ出力する</title> <script Language="JavaScript"><!-- str = "■■■■■■■■■■■■■■■■■■■■■■■■■■"; count = 0; function setText1() { if (count > str.length) return; count++; txt = str.substring(0,count); txt2 = gradTextConv(txt); if (document.all) document.all["outText"].innerHTML = txt2; if (document.layers) { document.layers["outText"].document.open(); document.layers["outText"].document.write(txt2); document.layers["outText"].document.close(); } setTimeout("setText1()",100); } function gradTextConv(sText) { p = 16 / str.length; str2 = ""; for (i=0; i<sText.length; i++) { pt = Math.floor(p*i); n = "0123456789ABCDEF".charAt(pt); c = "#"+n+n+"0000"; str2 = str2 + "<font size='20' color='"+c+"'> " + sText.charAt(i) + "</font>"; } return str2; } // --></script> </head> <body bgcolor="white" onload="setText1()"> <div id="outText" style="position:absolute;top:50px;left:5px;"></div> </body> </html>
- ベストアンサー
- その他（インターネット・Webサービス）
- JAVAのウインドウ振動の設定で質問です！
はじめまして！僕のHPには、JAVAの画面を振動させるやつをやっています。そこで質問ですが、画面の振動の仕方を激しくするにはどこをどういう風に変えればいいのでしょうか・・・JAVA専門のHPからコピペしただけなのでどこをいじればいいかわかりません・・・教えてください！よろしくおねがいします！ ソースはっておきますね。 <SCRIPT language="JavaScript"> <!-- itv = 100; // cnt = 0; x = new Array( 24,-34, 16,-32, 30, -26, 16, -8, 4,-12,0); y = new Array(-20, 8,-16, 12,-12, 16, -4, 20, -8, 4,0); function quakeWindow() { if(x[cnt] != 0) moveBy(x[cnt],y[cnt]); cnt++; if(cnt < x.length) setTimeout("quakeWindow()",itv); else cnt = 0; } //--> </SCRIPT> </HEAD> <BODY> <BODY bgcolor="black" onLoad="quakeWindow()"> </BODY>
- ベストアンサー
- JavaScript
- 画像をフェードインさせるタグについて
HP作成の際、 画像をフェードインさせたいのですが、 以下のタグをコピーして貼り付けても エラーになります。 どこを修正したらよいのでしょうか？ よろしくお願いします<m(__)m> <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- spd = 50; ntc = 2; fii = new Array("ia","ib","ic"); cnt = 0; i = 0; function fdInImg() { document.images[fii[i]].filters['alpha'].opacity = cnt; cnt += ntc; if(cnt >= 100) { cnt = 0; i++; } if(fii.length <= i) return; setTimeout("fdInImg()",spd); } //--> </SCRIPT> </HEAD> <BODY bgcolor="#ffffff" onLoad="fdInImg()"> 画像が順番にフェードインします。<BR><BR> <IMG src="画像のアドレス"> <IMG src="画像のアドレス"> <BR><BR> </BODY> </HTML>
- ベストアンサー
- その他（インターネット・Webサービス）
- このタグで文字の大きさを変えたいのですが、、、、
<head> <title>文字色をリアルタイムに変える</title> <script Language="JavaScript"><!-- count = 0; function changeColor(str) { txt = document.all["strID"].innerText; c = str.charAt(count); txt = txt.fontcolor("#"+c+c+"0000"); document.all["strID"].innerHTML = txt; count++; if (count > str.length) count = 0; setTimeout("changeColor('"+str+"')",100); } // --></script> </head> <body onLoad="changeColor('0123456789abcdefedcba987654321')"> <div id="strID" style="font-weight:900">ここの文字の色が変わるよ～ん</div> </body>
- ベストアンサー
- HTML
- クリックカウンター
クリックカウンターでの質問です。次の人になるとまた「0」になってしまいます。どうしてなのでしょう？ どなたか直していただけないでしょうか。 <HTML> <head> <Script language="JavaScript"> <!-- var cnt = 0; var flg = true; function f_click(){ if(flg){ cnt++; document.getElementById('Ninzu').innerHTML=cnt; flg = false; } } //--> </Script> </head> <BODY> <center> あなたは<span id="Ninzu">0</span>人目です。<br> <input type=button value="クリックしてね" onClick="f_click()"> </center> </BODY> </HTML>
- 締切済み
- HTML
- 10秒後に1秒ごとに1行づつ表示する方法
こんにちは。 質問がありまして、投稿致します。 タイトル通りなのですが、 10秒後に1秒毎に1行づつ表示する方法を探しております。 webで1秒毎に表示する方法は見つかりました。 ただ、10秒後に表示する方法が分からず困っております。 恐れ入りますが、ご指示頂けますと大変嬉しく思います。 --------------------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=SHIFT_JIS"> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 9.0.0.0 for Windows"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>TITLE</TITLE> <LINK rel="stylesheet" href="style.css" type="text/css"> <SCRIPT type="text/JavaScript"> <!-- itv = 1000; // 表示する間隔(ミリ秒単位) str = new Array(); // タグを入れる場合、「"」の前に「\」を付ける str[1] = "<FONT color=\"#999999\" size=\"2\">test1</FONT>"; str[2] = "<FONT color=\"#999999\" size=\"2\">test2</FONT>"; str[3] = "<FONT color=\"#999999\" size=\"2\">test3</FONT>"; str[4] = "<FONT color=\"#999999\" size=\"2\">test4</FONT>"; str[5] = "<FONT color=\"#999999\" size=\"2\">test5</FONT>"; str[6] = "<FONT color=\"#999999\" size=\"2\">test6</FONT>"; str[7] = "<FONT color=\"#999999\" size=\"2\">test7</FONT>"; str[8] = "<FONT color=\"#999999\" size=\"2\">test8</FONT>"; str[9] = "<FONT color=\"#999999\" size=\"2\">test9</FONT>"; cnt = 0; function setText() { if (cnt >= str.length) return; txt = ""; cnt++; for (i=0; i<cnt; i++) txt += str[i] + "<BR>"; if (document.all) document.all["ID"].innerHTML = txt; setTimeout("setText()",itv); } //--> </SCRIPT> </HEAD> <BODY bgcolor="#000000" onLoad="setText()"> <DIV id="ID" style="position:absolute;"></DIV><BR> </BODY> </HTML> --------------------------------------------------------------- 恐れ入りますが、10秒後に最初の1行目（test1）を表示し1秒後に2行目（test2）を表示し、その後繰り返し1秒間隔でtest3→test4・・・と表示しようとしております。 長文大変申し訳ありません。 宜しくお願い致します。
- ベストアンサー
- JavaScript
お礼
丁寧にありがとうございます！！ じっくりやってみます！！