キーを表示させて（自作）、キーを打つ。
その時、キーに対応する音階の音が鳴る。
キーAとHは無音だが、タッチが甘いと２つの音が鳴る。
そんな楽しい練習。
生協の注文のときは数字で、大体覚えられたが、
英字は3段あるので覚えにくく間違えやすい。
タッチタイピングのために。
バーチャルピアノ _ Musicca が見つかった。
HTML)
<!DOCTYPE html>
<html lang="ja">
<head>
<style type="text/css">
p { white-space: pre-wrap; font-family:'Helvetica','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; font-size: 80px; }
</style>
<meta charset="uft-8">
<title>
JavaScript Sample
</title>
</head>
<body>
<h1>
Type it.
</h1>
<p id="RealtimeClockArea">
START
</p>
<script src="test.js">
</script>
</body>
</html>
JavaScript)
const messages = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L',
'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'
];
console.log(Object.keys(messages).length);
let count = 0;
function countUp() {
const messageNo = Math.floor(Math.random() * messages.length);
/*
document.getElementById("RealtimeClockArea").innerHTML = messages[messageNo]+" "+count;
*/
document.getElementById("RealtimeClockArea").innerHTML = count +
" " + messages[messageNo];
count++;
if (count >= 256) {
clearInterval(intervalId);
/*
* この部分がコメントです。
document.getElementById("RealtimeClockArea").innerHTML = 'Timer ended.';
window.alert('Timer ended.');
*/
}
}
let intervalId = setInterval(countUp, 1500);
|
