一行テキストボックスに一文字ずつ表示させよう
表示の例
 テキストボックスの中の文字が、一文字ずつ表示されます。
プログラムＡのソースをコピーして、テキストボックスを表示させたい場所のHTMLソースのBODY区間に貼り付けしましょう。
プログラムＡのソース
<FORM name="f_msg1">
<INPUT name="t_msg1" size="58">
</FORM>
size="58" の 58 はテキストボックスのよこの大きさです。
プログラムＢのソースをコピーして、HTMLソースのHEAD区間に貼り付けしましょう。
プログラムＢのソース
<SCRIPT LANGUAGE="JavaScript">
<!--
var mes1="　ようこそ「５・６年生にもわかるやさしいＪａｖａＳｃｒｉｐｔ」へ！";
var i=0;
function msg1(){
if(i<=mes1.length){
mymes1=mes1.substring(0,i);
document.f_msg1.t_msg1.value=mymes1;
i++;
setTimeout("msg1()",150);
}else{
i=0;
setTimeout("msg1()",2000);
}
}
//-->
</SCRIPT>
プログラムＢのソースの上から３行目の、var mes1="　ようこそ「５・６年生にもわかるやさしいＪａｖａＳｃｒｉｐｔ」へ！"; の部分のメッセージを、あなたの好きな文章にかえてください。
メッセージを一文字ずつ表示するスピードは、下から８行目の setTimeout("msg1()",150); の 150 で設定をしています。数字が大きいほどおそくなっていきますから、あなたのお好みにかえてください。
メッセージがすべて表示されると、一時停止するようになっています。停止している時間は、下から５行目の setTimeout("msg1()",2000); の 2000 で設定をしています。この例では２秒間停止させていますので 2000 となっています。５秒なら 5000 というようにしてください。
プログラムＣのソースをコピーして、HTMLソースの<body の y のすぐうしろに半角スペースをひとつ入力してから貼り付けしましょう。
プログラムＣのソース
onload="msg1()"
ソースの文字をかえる時に、" や ; を消してしまわないようにしてください。
５・６年生にもわかるやさしいJavaScriptのTOPへ