画面上に文字が1文字ずつ出てきます。。
機能的には、フォームに1文字ずつ出てくる文字列やステータスバーに1文字ずつ出てくる文字列と同じです。
・サンプルを見る
・ソースを保存する
（右クリック→「対象をファイルに保存」or「リンクを名前を付けて保存」して下さい。）
・ソースを見る
・解説を見る
[ ソース ]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<script language="JavaScript">
<!--//Copyright (C) WEST MiRa http://www.west-mira.jp
//表示する文字を指定
moji='文字が1文字ずつ出てきます。';
//文字が流れる欄の横幅を指定
my_width=250;
//文字が流れる欄の横位置を指定
x_iti=340;
//文字が流れる欄の縦位置を指定
y_iti=160;
//流れる早さを指定
hayasa=150;
a=0;
hajime=0;
len=1;
function hyouji()
{
if(document.layers)
{
document.layers["lay0"].moveTo(x_iti,y_iti);
document.layers["lay0"].clip.width=my_width;
document.layers["lay0"].document.open();
document.layers["lay0"].document.write(moji.substring(0,len));
document.layers["lay0"].document.close();
}
else if((document.getElementById) && (!document.all))
{
document.getElementById("lay0").style.left=x_iti;
document.getElementById("lay0").style.top=y_iti;
document.getElementById("lay0").style.width=my_width;
document.getElementById("lay0").innerHTML=moji.substring(0,len);
}
else if(document.all)
{
document.all("lay0").style.pixelLeft=x_iti;
document.all("lay0").style.pixelTop=y_iti;
document.all("lay0").style.width=my_width;
document.all("lay0").innerHTML=moji.substring(0,len);
}
len=(moji.length < len)?0:len+1;
clearTimeout(a);
a=setTimeout('hyouji();',hayasa);
}
//-->
</script>
</head>
<body onLoad="hyouji();">
<span id="lay0" style="position:absolute;visibility:visible;"></span><br>
・
・
・
</body></html>
[ 解説 ]
まず表示させたい文字を書き換えます。
上から7行目の「文字が1文字ずつ出てきます。」にお好きな文字をお書き下さい。
次に、文字列が表示される部分の幅を決めます。
上から11行目の「my_width=250;」の「250」の部分を変えてください。
高さを変えたい場合は、その下の「my_height=15;」の「15」を変えてください。
文字列が表示される位置を変えるには、
上から15行目の「x_iti=300;」と上から16行目の「y_iti=160;」の数値を変えてください。
またそのちょっと上の「x_purasu=40;」と「y_purasu=0;」を変えても変わります。
文字列が現れる早さを変えたい場合は、上から9行目の「hayasa=150;」の数値を変えて下さい。
|
