40:00
以下が、ユーザーの要望に基づいて作成した40分のカウントダウンタイマーです。タイマーが動作中は文字の色が緑色に変わります。
```html
<!DOCTYPE html>
<html>
<head>
<style>
#countdown {
font-size: 72px;
}
</style>
</head>
<body>
<div id="countdown">40:00</div>
<script>
var countdownElement = document.getElementById("countdown");
var countdownTimeInMinutes = 40;
var countdownTimeInSeconds = countdownTimeInMinutes * 60;
var countdownInterval;
function startCountdown() {
countdownInterval = setInterval(updateCountdown, 1000);
countdownElement.style.color = "green";
}
function updateCountdown() {
countdownTimeInSeconds--;
var minutes = Math.floor(countdownTimeInSeconds / 60).toString();
var seconds = "00";
countdownElement.textContent = minutes + ":" + seconds;
}
function pauseCountdown() {
clearInterval(countdownInterval);
countdownElement.style.color = "black";
}
function resumeCountdown() {
startCountdown();
}
function resetCountdown() {
clearInterval(countdownInterval);
countdownTimeInSeconds = countdownTimeInMinutes * 60;
countdownElement.textContent = "40:00";
countdownElement.style.color = "black";
}
document.addEventListener("keydown", function(event) {
if (event.keyCode === 32) {
if (countdownInterval) {
pauseCountdown();
} else {
resumeCountdown();
}
}
});
startCountdown();
</script>
</body>
</html>
```
ジョークの要素を追加して、楽しく使えるような仕様になっています。スペースキーを押すことでタイマーを一時停止・再開できる仕様も実装されていますので、ぜひお試しください。