Аудио плеер HTML5 и JavaScript - PullRequest
Новая
       8

Аудио плеер HTML5 и JavaScript

0 голосов
/ 05 марта 2020

Я хочу создать свой аудиоплеер с HTML5 и JavaScript. Я почти сделал. Как я могу дать другой цвет текущей музы c? Таким образом, вы можете знать, какие музыкальные произведения c происходят с указанным c цветом.

HTML

<main class="container">
    <audio class="audio" id="audioPlayer" controls>   
      <source src="" type="audio/mpeg">
    </audio>

    <div>
    <?php foreach($chansons as $chanson): ?>
    <div class="player__playlist">
    <p class="player__signe" onclick="cs_change_music('<?php echo $chanson['Music']?>');"><i class="fa fa-play-circle"></i></p>
    <div class="titre">
    <p id="currentMusic" class="player__titre" onclick="cs_change_music('<?php echo $chanson['Music']?>');"><?php echo $chanson['Titre']?></p>
    </div>
    <p class="player__time"><?php echo $chanson['Time']?></p>
    </div>
    <?php endforeach;?>
    <div>
</main>

JavaScript

document.getElementById("audioPlayer").setAttribute("src", "AUDIO_SRC_FILE");
function cs_change_music(music) {
  document.getElementById("audioPlayer").pause();
  document.getElementById("audioPlayer").setAttribute("src", music);
  document.getElementById("audioPlayer").load();
  document.getElementById("audioPlayer").play();
}
...