Question

所以我有一个朋友帮我建立一个自动播放音乐的剧本，包括一个没有所有额外业务的静音按钮，以及循环......但是它并没有循环导航这页纸。当您将网站导航到其他页面时，音乐会重新启动。所以我想知道，我需要放入哪些cookie以及在哪里，因为我之前的cookie显然导致了静音按钮的问题。 那么，在音乐延迟时添加跟踪的内容以及添加上次播放时恢复的Cookie会是什么？这样，当用户点击同一网站中的其他网页时，音乐就不会＃ 39;重新开始，并从它的最后一个播放点继续播放。我还会包含之前使用过Cookie的代码，也许还有一种方法可以将两者混合在一起以获得声音按钮和连续的音乐流程？

<audio tabindex="0" id="Backgroundmusic" controls preload="auto" >
    <source src="http://bdo-mfh.weebly.com/files/theme/InstrumentalCore-LetThereBeLight.mp3">
</audio>
    <a href="#" id="bn-sound"><img src="http://findicons.com/files/icons/772/token_light/256/sound.png" /></a>



<script type="text/javascript">$(document).ready(function() {
    playStream();
});
function playStream() {

        var player = document.getElementById('Backgroundmusic');

        (player.paused == true) ? toggle(0) : toggle(1);

        $('#bn-sound').click(function() {

            (player.paused == true) ? toggle(0) : toggle(1);

            return false;

        });

}

function toggle(state) {

        var player = document.getElementById('Backgroundmusic');
        var link = document.getElementById('bn-sound');
        var src = "http://bdo-mfh.weebly.com/files/theme/InstrumentalCore-LetThereBeLight.mp3";

        switch(state) {
                case 0:  
                        player.play();
                        $('#bn-sound').removeClass('sound-pause');
                        player_state = 1;
                        break;
                case 1:
                        player.pause();
                        player.currentTime = 0;
                        player.src = '';
                        $('#bn-sound').addClass('sound-pause');
                        player_state = 0;
                        break;
        }
}</script>

<style>.sound-pause {
    opacity: 0.2; 
}
#bn-sound {
    width: 40px;
    display: block;
}
#bn-sound img {
    width: 100%;
}
#Backgroundmusic {
    display: none;
}</style>

现在我以前的代码

        <audio id= "Backgroundmusic" preload="auto" src="MUSIC.MP3" loop="true" autobuffer>
Unsupported in Firefox
</audio>
<a href="#noscroll" id="mute">toggle sound</a>

<script>

var audio = document.getElementById('Backgroundmusic');

document.getElementById('mute').addEventListener('click', function (e)
{
    e = e || window.event;
    audio.muted = !audio.muted;
    e.preventDefault();
}, false);

function setCookie(c_name,value,exdays)
{
    var exdate=new Date();
    exdate.setDate(exdate.getDate() + exdays);
    var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
    document.cookie=c_name + "=" + c_value;
}

function getCookie(c_name)
{
    var i,x,y,ARRcookies=document.cookie.split(";");
    for (i=0;i<ARRcookies.length;i++)
    {
      x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
      y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
      x=x.replace(/^\s+|\s+$/g,"");
      if (x==c_name)
        {
        return unescape(y);
        }
      }
}

var song = document.getElementsByTagName('audio')[0];
var played = false;
var tillPlayed = getCookie('timePlayed');
function update()
{
    if(!played){
        if(tillPlayed){
        song.currentTime = tillPlayed;
        song.play();
        played = true;
        }
        else {
                song.play();
                played = true;
        }
    }

    else {
    setCookie('timePlayed', song.currentTime);
    }
}
setInterval(update,1000);
</script>

HTML / CSS / Javascript将跟踪Cookie添加到脚本

0 个答案: