|
|
Line 165: |
Line 165: |
| <audio loop class="my-song" src="<!--{$mp3|escape:'urlpathinfo'}-->" preload="auto"></audio> | | <audio loop class="my-song" src="<!--{$mp3|escape:'urlpathinfo'}-->" preload="auto"></audio> |
| </div> | | </div> |
| <script>
| |
| let state = false;
| |
| let btn = document.querySelector(".btn");
| |
| let record = document.querySelector(".record");
| |
| let toneArm = document.querySelector(".tone-arm");
| |
| let song = document.querySelector(".my-song");
| |
| let slider = document.querySelector(".slider");
| |
|
| |
| btn.addEventListener("click", () => {
| |
| if (state == false) {
| |
| record.classList.add("on");
| |
| toneArm.classList.add("play");
| |
| setTimeout(() => {
| |
| song.play();
| |
| }, 1000);
| |
| } else {
| |
| record.classList.remove("on");
| |
| toneArm.classList.remove("play");
| |
| song.pause();
| |
| }
| |
| state = !state;
| |
| });
| |
|
| |
| slider.addEventListener("input", (e) => {
| |
| song.volume = Number(e.target.value);
| |
| });
| |
| </script>
| |
| </html> | | </html> |
| </includeonly> | | </includeonly> |