タグ

2024年1月7日のブックマーク (1件)

  • 1ファイルでタイピングゲームを作る - Qiita

    1つのhtmlファイルで、タイピングゲームを作成します。 タイピングする文字は、preタグに入れておきます。 javascriptでこれから打つ文字、打ち終わった文字をそれぞれのpre内のspanタグに入れます。 これから打つ文字、打ち終わった文字は、CSSで見た目を変えます。 残り時間は、setIntervalで減らしていきます。 ゲーム開始前に、初期の残り時間を増やしたり、減らしたりできます。 ちょっと制限としては次のような感じです。 プログラムのタイプ練習用としているので、字下げ部分は、タイプしなくても先に進むようになっています。 その字下げは、ゲーム内ではスペース2つ以上が連続するところ、と判断しているので、字下げ以外でスペース2つ以上を作ると、タイプせずに飛ばされてしまいます。 また別記事の1つのjsファイルで効果音を鳴らすを利用すると、タイプ音を付けることもできます。 ソースコ

    1ファイルでタイピングゲームを作る - Qiita