カオナシの時計　効果音付き's game

Click here for free DL of the app version that can save data.

No:24395

←

Prev Next

→

カオナシの時計　効果音付き
Developer 時計｜Date and time 23/11/8 17:00:01
Build time 68.184 sec｜Game capacity 1.991KB｜

Script

了解です。以下に、スマホ向けの「カオナシの時計」というゲームの実装例を示します。

⏰

このプログラムは、時刻を表示する「カオナシの時計」を実装しています。HTMLの`<div>`要素内に、時刻を表示するためのテキストを表示し、JavaScriptで現在時刻の取得と表示を行うようになっています。また、1秒ごとに現在時刻を更新し、効果音も付けるようになっています。なお、「カオナシの時計」の効果音は、`sound.mp3`というファイル名であらかじめ用意しておく必要があります。効果音はお好みで変更してください。このプログラムを1枚のHTMLファイルとして保存し、スマートフォンで開くことで遊ぶことができます。必要に応じて、CSSのスタイルやフォントサイズなどのデザイン要素を調整することもできます。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

Click here for free DL of the app version that can save data.

了解です。以下に、スマホ向けの「カオナシの時計」というゲームの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>カオナシの時計</title>
  <style>
    body {
      font-size: 2rem;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
    }
  </style>
</head>
<body>
  <div id="clock">⏰</div>

function updateClock() {
      const date = new Date();
      const hours = date.getHours();
      const minutes = date.getMinutes();
      const seconds = date.getSeconds();

const timeString = `${formatTime(hours)}:${formatTime(minutes)}:${formatTime(seconds)}`;
      clockElement.textContent = timeString;

// 効果音を再生
      playSound();

setTimeout(updateClock, 1000);
    }

function formatTime(value) {
      return value < 10 ? `0${value}` : value;
    }

function playSound() {
      const audio = new Audio('sound.mp3');
      audio.play();
    }

updateClock();
  </script>

</body>
</html>
```

このプログラムは、時刻を表示する「カオナシの時計」を実装しています。HTMLの`<div>`要素内に、時刻を表示するためのテキストを表示し、JavaScriptで現在時刻の取得と表示を行うようになっています。また、1秒ごとに現在時刻を更新し、効果音も付けるようになっています。

なお、「カオナシの時計」の効果音は、`sound.mp3`というファイル名であらかじめ用意しておく必要があります。効果音はお好みで変更してください。

このプログラムを1枚のHTMLファイルとして保存し、スマートフォンで開くことで遊ぶことができます。必要に応じて、CSSのスタイルやフォントサイズなどのデザイン要素を調整することもできます。