From 687ba8de403042487de1a126f94500bd10d19392 Mon Sep 17 00:00:00 2001 From: Tyler Hoang Date: Tue, 26 May 2026 00:51:50 -0700 Subject: add volume slider next to music toggle Co-Authored-By: Claude Opus 4.7 --- index.html | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index a71ed89..287fef9 100755 --- a/index.html +++ b/index.html @@ -351,17 +351,26 @@ }); }); - // music toggle + // music toggle + volume slider document.getElementById('mt').innerHTML = Aero.musicToggleHTML(); const mtDiv = document.getElementById('mt'); const mtBtn = mtDiv.querySelector('.mt-btn'); const mtLabel = mtDiv.querySelector('.mt-label'); const bgm = document.getElementById('bgm'); + bgm.volume = 0.2; + + const vol = document.createElement('input'); + vol.type = 'range'; vol.min = '0'; vol.max = '1'; vol.step = '0.01'; vol.value = '0.2'; + vol.className = 'no-drag aero-vol'; + vol.title = 'volume'; + vol.style.cssText = 'width:70px;margin-left:6px;cursor:pointer;accent-color:oklch(55% 0.13 230);vertical-align:middle;'; + mtDiv.querySelector('.music-toggle').appendChild(vol); + vol.addEventListener('input', () => { bgm.volume = Number(vol.value); }); + let musicOn = false; mtBtn.addEventListener('click', () => { musicOn = !musicOn; if (musicOn) { - bgm.volume = 0.2; bgm.play(); mtBtn.textContent = '❚❚'; mtLabel.textContent = '♪ a-dog — bazaar theme'; -- cgit v1.3-2-g0d8e