music library html code example

Example 1: how to add Music to body html

<!DOCTYPE html>
<html>
   <head>
      <title>HTML background music</title>
   </head>
   <body>
      <p>The music is running in the background.</p>
      <p>(Song: Kalimba which is provided as a Sample Music in Windows)</p>
      <embed src="/html/Kalimba.mp3" loop="true" autostart="true" width="2" height="0">
   </body>
</html>

Example 2: how to make a music playlist html

<!-- There are several ways but if you are a begginer this is quite simpler-->

<!--In Your JavaScript Code-->
<script>
  <!-- Make an array of the song locations in javascript -->
  Arr = ['song1.mp3', 'song2.mp3', 'song3.mp3']

  <!-- Make the function -->
  function func(x) {
    document.getElementById('musicPlayer').setAttribute('src', Arr[x])
  }
</script>

<!-- In Your Html Code -->
<!-- Create a music element -->
<audio controls id="musicPlayer" autoplay>
<source src="" type="audio/mp3"> <!--Make sure not to put anything in the scr-->
</audio>

<!-- Create a few buttons -->
<button onclick="func(0)">Song 1</button>
<button onclick="func(1)">Song 2</button>
<button onclick="func(2)">Song 3</button>

<!-- I hope this was helpful! -->

Tags:

Html Example

Recent Posts