跨瀏覽器實(shí)現(xiàn)音頻

<html>

<head>
    <meta charset="utf-8">
    <title>跨瀏覽器實(shí)現(xiàn)音頻</title>

</head>

<body>
    <audio id="main_audio" preload="auto" loop="loop" volume="1.0" style="position: absolute; z-index: 20000" autoplay="true">
            <source src="http://tyl.yy.com/s/qxz/img/bgm.mp3" type="audio/mpeg">
            <object id="main_audio_ie8" classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" style="display:none"> 
                <param name="URL" value="http://tyl.yy.com/s/xcyz/img/bgm.mp3">
                <param name="uiMode" value="invisible"> 
                <param name="autoStart" value="true">
                <param name="volume" value="100">
                <param name="playCount" value="2147483647"> 
            </object> 
        </audio>
    <div id="controls" class="controls music on-off-music">
        <span></span>關(guān)閉音樂(lè)
    </div>
    <script>
        var isPlaying, audio = document.getElementById('main_audio');
        if (audio.play instanceof Function) isPlaying = function(audio) {
            return !audio.paused;
        };
        else {
            audio = document.getElementById('main_audio_ie8');
            isPlaying = function(audio) {
                return audio.playState == 3;
            };
            audio.play = function() {
                this.controls.play();
            }
            audio.pause = function() {
                this.controls.pause();
            }
        }
        document.querySelector('.on-off-music').onclick = function() {
            if (isPlaying(audio)) {
                audio.pause();
                this.innerHTML = "<span style='background-image:url(http://tyl.yy.com/s/qxz/img/music-on.png)'></span>開(kāi)啟音樂(lè)";
            } else {
                audio.play();
                this.innerHTML = "<span style='background-image:url(http://tyl.yy.com/s/qxz/img/music-off.png)'></span>關(guān)閉音樂(lè)";
            }
        };
    </script>

</body>

</html>
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容