- ベストアンサー
このタグで文字の大きさを変えたいのですが、、、、
<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>
- hikarika1
- お礼率90% (4734/5233)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
以下のようにスタイルシートを使えば大丈夫だと思います。 ちなみにこれでは「30pt」（大きめ）になります。 <head> <title>文字色をリアルタイムに変える</title> <!--◆◆◆◆◆ココカラ◆◆◆◆◆--> <STYLE type="text/css"> <!-- div{font-size:30pt; } --> </STYLE> <!--◆◆◆◆◆ココマデを追加◆◆◆◆◆--> <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>
関連するQ&A
- このタグはグラデーションですが、文字が小さくて困っています。
<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
- このタグの文字サイズを大きくしたいのですが、、、
<head> <title>１文字づつ画面上に出力する</title> <script language="JavaScript"><!-- str = "Sample text...(^^)/ By KaZuhiro FuRuhata"; count = 0; function setText1() { if (count > str.length) return; count++; txt = str.substring(0,count); if (document.all) document.all["outText"].innerHTML = txt; if (document.layers) { document.layers["outText"].document.open(); document.layers["outText"].document.write(txt); document.layers["outText"].document.close(); } setTimeout("setText1()",100); } // --></script> </head> <body> <a href="javaScript:setText1()">出力開始</a> <div id="outText" style="position:absolute;top:50px;left:5px;"></div> </body>
- ベストアンサー
- その他（インターネット・Webサービス）
- このタグが繰り返しにならないでしょうか？（今は、一度で終わります。）
このタグが繰り返しにならないでしょうか？（今は、グラデーションが一度で終わります。） <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サービス）
- すいません、このタグですが、自動で始まるようにならないでしょうか？
<title>１行づつ画面上に出力する</title> <STYLE type="text/css"> <!-- div{font-size:20pt; } --> </STYLE> <script Language="JavaScript"><!-- str = new Array(); str[0] = "Sample text...(^^)/<br>"; str[1] = "１行づつ表示します。<br>"; str[2] = "By KaZuhiro FuRuhata<br>"; str[3] = "<a href='http://www.shiojiri.ne.jp/~openspc/'>OpenSpace</a>"; count = 0; function setTextLine() { if (count >= str.length) return; txt = ""; count++; for (i=0; i<count; i++) txt += str[i]; if (document.all) document.all["outText"].innerHTML = txt; setTimeout("setTextLine()",1000); } // --></script> </head> <body> <DIV id="outText" style="position:absolute;top : 167px;left : 112px;"></DIV> <DIV style="width : 139px;height : 76px;top : 10px;left : 146px; position : absolute; z-index : 1; " id="Layer1"><a href="javaScript:setTextLine()">出力開始</a></DIV> </body>
- ベストアンサー
- その他（インターネット・Webサービス）
- Javascriptで文字の書き換え
現在、IE8とChromeを使用しています。 どちらのブラウザで試してもdocument.write("文");は読み込みますが <id>で指定したタグの中身が変わりません。 javascriptに書いたinnerHTML及びinnerTextの使い方か、もしくは、 根本的なところを何処か間違っているでしょうか？ -----------HTML文------------------------------------------------------ <!doctype html> <html lang="ja"> <head> <meta charset="utf-8"> <title>2011_09_02_1</title> <link rel="stylesheet" href="2011_09_02_1.css"> <script type="text/javascript" src="2011_09_02_1.js"></script> <body> <div id="str"><h3>Good morning</h3></div> </body> </html> ---------------外部CSS文----------------------------------------------- div h3{ color:#0000ff; } ---------------外部javascript文------------------------------------------ //タグを含む書き換え用ソース document.write("読み込むかテスト"); var chenge; chenge = document.getElementById(str); chenge.innerHTML = "Good Night"; ---------------------------------------------------------- //下は後から試した文--------文字のみ書き換え用ソース document.write("読み込むかテスト"); //document.getElementById("str").innerText = "Good Night"; --------------------------------------------------------------------------
- ベストアンサー
- 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> この意味もわかりません。表示したい文字を「文字列」に置き換えれば良いのですか？？そしてこの一文をどこに組み込めば良いのかもわかりません・・・。 何度かやってみましたがエラーになってしまいます。 他の方法でも良いので、お解かりになるかた宜しくお願いいたします！
- ベストアンサー
- ホームページ作成ソフト
- 初期表示を変えるには？
下記のようなタグで、オンマウスでフェードイン、離れればフェードアウトの設定にしたいのですが、文字が隠れた状態が初期表示にする場合はどうしたらいいんでしょうか？？ 簡単なことかもしれないですが、どなたか教えてください。 <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>
- ベストアンサー
- JavaScript
- リンクをマウスオーバーでフェードイン・アウトがしたです。
リンクをマウスオーバーでフェードイン・アウトがしたです。 以下のようなソースを書いたのですが、ページを開いた１回目のみ、画像と文字がフェードインして、以下のリンクをマウスオーバーした時には、普通に画像と文字が入れ替わります。リンクをマウスオーバーした時にもフェードイン・アウトさせるには、どのように変更すればいいのでしょうか？ <html> <head> <script src="jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { $('div').fadeIn("slow"); }); </script> <head> <body> <div style="display:none;"> <img src="img/1.png" name="foo"> <br> <span id="buntate">眺める</span> </div> <a href="javascript:void(0)" onmouseover="document.foo.src='img/2.png';document.all.buntate.innerText='サーファー';" onmouseout="document.foo.src='img/1.png';document.all.buntate.innerText='眺める';"> hoge1</a> <br> <a href="javascript:void(0)" onmouseover="document.foo.src='img/3.png';document.all.buntate.innerText='海';" onmouseout="document.foo.src='img/1.png';document.all.buntate.innerText='眺める';"> hoge2</a> </body> </html> 沢山いろいろと試したのですが、自分で解決出来ず・・・ ごご教授、よろしくお願いいたします。
- ベストアンサー
- JavaScript
- 黒背景で、白文字（リンク挿入）をフェードインするHTMLソースを教えて
黒背景で、白文字（リンク挿入）をフェードインするHTMLソースを教えてください。 <head>の間に、 <script language="JavaScript"> <!-- var count = 0; var f3 = "0123456789abcdef"; function fadein(i) { if ( count < 16 ) { c = f3.charAt(i); document.fgColor = c + c + c + c + c + c; count++; setTimeout("fadein(count)",100); } } fadein(); //--> </script> </head> <body bgcolor="#000000" text="#ffffff"> 以上のタグを入れ、 <body bgcolor="#000000" text="#ffffff"> タグを<body>の代わりに置くと、リンク挿入されていない文字はフェードインされるのですが、リンク挿入文字は対応されません。 ソースをどのようにすれば、リンク挿入文字もフェードイン対応されるでしょうか。
- ベストアンサー
- JavaScript
- TEXTAREA内の改行位置をinnerHTMLで反映させたい
例えば、 <HTML> <HEAD> <SCRIPT> function send(){ var message = f1.message.value var str = '<HTML>\n<HEAD>\n</HEAD>\n<BODY>\n' str += ''+ message +'\n' str += '</BODY>\n</HTML>' document.frame1.document.body.document.body.innerHTML = str } </SCRIPT> </HEAD> <BODY> <FORM name="f1"> <TEXTAREA rows="10" cols="40" name="message" onChange="send()"></TEXTAREA> </FORM> <IFRAME name="frame1" id="frame1" width="90%" height="350"></IFRAME> </BODY> </HTML> このような記述をして、テキストエリア内に文字を数行にわたって書き込んでも改行はされません。 どのようにすれば改行されるようになりますか？ innerHTMLのところをinnerTEXTとして改行位置に<BR>タグが入るようにするのでもかまわないのですが、、、 どなたかお分かりになる方、ご教授願います。
- ベストアンサー
- JavaScript
お礼
回答ありがとうございました、希望どうりにできました、ありがとうございました。