30フレームの動画をBPMに合わせるアプリ
BPMを入力すると、動画のフレーム数を計算します。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>30フレームの動画をBPMに合わせるアプリ</title>
</head>
<body>
<h1>30フレームの動画をBPMに合わせるアプリ</h1>
<p>BPMを入力すると、動画のフレーム数を計算します。</p>
<form>
<label for="bpmInput">BPM:</label>
<input type="number" id="bpmInput" name="bpmInput">
<button type="button" onclick="calculateFrame()">計算する</button>
</form>
<p id="result"></p>
<script>
function calculateFrame() {
// BPM入力値の取得
const bpm = parseFloat(document.getElementById("bpmInput").value);
// BPMが0以下、またはNaNの場合は処理を中止
if (bpm <= 0 || isNaN(bpm)) {
alert("正しいBPMを入力してください。");
return;
}
// フレーム数の計算
const frame = Math.round(30 * 60 / bpm * 100) / 100;
// 結果の表示
document.getElementById("result").innerHTML = `${bpm} BPMに合わせるためには、動画のフレーム数は${frame}フレームになります。`;
}
</script>
</body>
</html>
※ジョーク的な要素は含まれていません。