comment faire le bouton lecture / pause

Question 1

J'aimerais que le bouton pause reprenne la chanson à partir de l'endroit où elle a été interrompue au lieu de redémarrer la chanson.

Avec vanilla javascript uniquement s'il vous plaît, merci!

var songs = [
  "song1.mp3",
  "song2.mp3",
  "song3.mp3",
];

var song = new Audio();
var currentSong = 0;

var playButton = document.querySelector(".play");
var pauseButton = document.querySelector(".pause");

function playSong() {
  song.src = songs[currentSong];
  pauseButton.style.display = "block";
  playButton.style.display = "none";
  songTitle.textContent = sT[currentSong];
  Artist.textContent = artistNames[currentSong];
  songCover.src = songCovers[currentSong];
  song.play();
}

playButton.addEventListener("click", function playSong() {
  song.src = songs[currentSong];
  pauseButton.style.display = "block";
  playButton.style.display = "none";
  songTitle.textContent = sT[currentSong];
  Artist.textContent = artistNames[currentSong];
  songCover.src = songCovers[currentSong];
  song.play();
});

pauseButton.addEventListener("click", function pauseSong() {
  song.pause();
  pauseButton.style.display = "none";
  playButton.style.display = "block";
});

javascript audio

0

caíd 3 nov. 2019 à 16:09

Answer

Le morceau est réinitialisé car chaque fois que vous cliquez sur le bouton play, le src du morceau est à nouveau attribué. Et donc la chanson recommencera depuis le début.

Vous devrez donc modifier la partie de votre code où la chanson est sélectionnée. Faites-le en dehors de la fonction play de sorte que le fait de cliquer sur lecture ne joue que, et que cliquer sur pause ne fasse que suspendre.

function chooseSong() {
  song.src = songs[currentSong];
  songTitle.textContent = sT[currentSong];
  Artist.textContent = artistNames[currentSong];
  songCover.src = songCovers[currentSong];
}

function playSong() {
  pauseButton.style.display = "block";
  playButton.style.display = "none";
  song.play();
}

function pauseSong() {
  pauseButton.style.display = "none";
  playButton.style.display = "block";
  song.pause();
}

playButton.addEventListener('click', playSong);
pauseButton.addEventListener('click', pauseSong);

chooseSong();

0

Emiel Zuurbier 3 nov. 2019 à 14:26

Question 2

Le morceau est réinitialisé car chaque fois que vous cliquez sur le bouton play, le src du morceau est à nouveau attribué. Et donc la chanson recommencera depuis le début.

Vous devrez donc modifier la partie de votre code où la chanson est sélectionnée. Faites-le en dehors de la fonction play de sorte que le fait de cliquer sur lecture ne joue que, et que cliquer sur pause ne fasse que suspendre.

function chooseSong() {
  song.src = songs[currentSong];
  songTitle.textContent = sT[currentSong];
  Artist.textContent = artistNames[currentSong];
  songCover.src = songCovers[currentSong];
}

function playSong() {
  pauseButton.style.display = "block";
  playButton.style.display = "none";
  song.play();
}

function pauseSong() {
  pauseButton.style.display = "none";
  playButton.style.display = "block";
  song.pause();
}

playButton.addEventListener('click', playSong);
pauseButton.addEventListener('click', pauseSong);

chooseSong();

0

Emiel Zuurbier 3 nov. 2019 à 14:26

comment faire le bouton lecture / pause

1 réponse

Questions connexes

De nouvelles questions

javascript