JavaScriptで「ロシアより愛をこめて」

JavaScriptでsetTimeout関数の使い方サンプルを作った。

titleに設定した文字列をStringクラスのcharAtで一文字ずつ先頭から取り出し、画面に表示している。

	moji = title.charAt(pos);

途中からsetTimeout関数の実行間隔を早めている。

	if(pos > 5) speed = 200;
	setTimeout(lupin, speed);

関数lupinの中でsetTimeout関数を使って設定ミリ秒後に再度lupin関数を呼び出している。これは再帰という方法だ。

JavaScript部分全体

var title = "ロシアより愛をこめて";
var speed = 350;
var color = "#fff";
var background = "#f00";
var size = "480px";
var pos = 0;
function init(){
	document.body.style.backgroundColor = background;
	document.getElementById("lupin").style.color = color;
	document.getElementById("lupin").style.fontSize = size;
	lupin();
}
function last(){
	var message = document.getElementById("lupin");
	message.style.fontSize = "128px";
	message.style.textAlign = "center";
	message.innerHTML = title;
}
function lupin(){
	var message = document.getElementById("lupin");
		moji = title.charAt(pos);
	message.innerHTML = moji;
	pos++;
	if(pos > title.length){
		last();
	}
	if(pos > 5) speed = 200;
		setTimeout(lupin, speed);
}

ところで、ルパン三世は、日本漫画の名作だと思う。

タイトルとURLをコピーしました