Html 5浮窗音樂播放器是一種非常實用的功能,它可以幫助網站毫不費力地展示音樂播放器。這里有一個簡單的HTML 5浮窗音樂播放器代碼示例,您可以使用它來為自己的網站添加這個很酷的功能。
<html> <head> <title>HTML5音樂播放器</title> <script> window.onload = function(){ var audio = document.getElementById('audioPlayer'), playButton = document.getElementById('play'), pauseButton = document.getElementById('pause'), stopButton = document.getElementById('stop'), volumeSlider = document.getElementById('vol'); playButton.onclick = function(){ audio.play(); }; pauseButton.onclick = function(){ audio.pause(); }; stopButton.onclick = function(){ audio.pause(); audio.currentTime = 0; }; volumeSlider.onchange = function(){ audio.volume = volumeSlider.value; }; }; </script> </head> <body> <audio id="audioPlayer" src="path/to/music.mp3" preload="metadata"></audio> <button id="play">播放</button> <button id="pause">暫停</button> <button id="stop">停止</button> <input type="range" min="0" max="1" step="0.01" value="0.5" id="vol"> </body> </html>
這段代碼包括所有必要的元素和事件來實現基本的音樂播放器。您可以通過添加CSS樣式和進一步的Javascript代碼來改善這個播放器的外觀和功能,使它適合您的網站需求。