Я делаю расширение Google Chrome, где вы нажимаете определенные кнопки, оно запускается, приостанавливает или перезапускает песню. Я получил это работает, но есть одна проблема. Когда я закрываю расширение, песня останавливается! Мне нужно знать, есть ли способ обойти это. Я изучил фоновые сценарии и прочее, но не могу заставить их работать. Пожалуйста, помогите, так как это одно из моих первых расширений Google Chrome, и я хотел бы узнать больше. Спасибо за любую помощь, которую вы мне оказали!
HTML: (popup.html)
<html>
<head>
<link rel="stylesheet" href="styles.css">
<script src="popup.js"></script>
</head>
<body>
<center>
<h1>Music Player</h1>
<h3>Songs:</h3>
<div id="ludicrous_speed">Ludicrous Speed
<audio id="ludicrous" src="songs/ludicrous_speed.mp3" preload="auto"></audio>
<button class="Start" id="StartLudicrous">Start</button>
<button class="Pause" id="PauseLudicrous">Pause</button>
<button class="Restart" id="RestartLudicrous">Restart</button>
</div>
</center>
</body>
</html>
Javascript: (popup.js)
function Start(song) {
song.play();
}
function Pause(song) {
song.pause();
}
function Restart(song) {
song.currentTime = 0;
}
document.addEventListener('DOMContentLoaded', function(){
var Start_Ludicrous = document.getElementById('StartLudicrous');
var Pause_Ludicrous = document.getElementById('PauseLudicrous');
var Restart_Ludicrous = document.getElementById('RestartLudicrous');
Start_Ludicrous.addEventListener('click', function() {
Start(ludicrous);
});
Pause_Ludicrous.addEventListener('click', function() {
Pause(ludicrous);
});
Restart_Ludicrous.addEventListener('click', function() {
Restart(ludicrous);
});
});
CSS: (styles.css)
body {
width:300px;
}
.Start {
background-color: #42f46e;
border-color: #42f46e;
border-radius: 30%;
}
.Pause {
background-color: #f4e349;
border-color: #f4e349;
border-radius: 30%;
}
.Restart {
background-color: #e03838;
border-color: #e03838;
border-radius: 30%;
}
Манифест: (manifest.json)
{
"manifest_version":2,
"name":"Music Player",
"description":"Play Music",
"version":"1.0",
"browser_action":{
"default_popup":"popup.html"
},
"permissions":[
"activeTab"
]
}