danpastori

<audio id="song" width="300" height="32" ontimeupdate="updateTime()"><source src="path/to/music.mp3" type="audio/mp3" /></audio>

danpastori

<audio id="song" width="300" height="32" ontimeupdate="updateTime()" controls="controls"><source src="path/to/music.mp3" type="audio/mp3" /></audio>

danpastori

#songPlay{

}

danpastori

#songPause{

}

danpastori

//Does a switch of the play/pause with one button.
function playPause(id){
  
  //Sets the active song since one of the functions could be play.
  activeSong = document.getElementById(id);
  
  //Checks to see if the song is paused, if it is, play it from where it left off otherwise pause it.
  if (activeSong.paused){
    activeSong.play();
  }else{

danpastori

#songPlayPause{

}

danpastori

//Stop song by setting the current time to 0 and pausing the song.
function stopSong(){
  activeSong.currentTime = 0;
  activeSong.pause();
}

danpastori

//Changes the volume up or down a specific number
function changeVolume(number, direction){
  //Checks to see if the volume is at zero, if so it doesn't go any further.
  if(activeSong.volume >= 0 && direction == "down"){
    activeSong.volume = activeSong.volume - (number / 100);
  }
  
  //Checks to see if the volume is at one, if so it doesn't go any higher.
    if(activeSong.volume activeSong.volume = activeSong.volume + (number / 100);
  }

danpastori

/*Volume Up Button*/
#volumeUp{

}
/*Volume Down Button*/
#volumeDown{

}

danpastori

//Set's volume as a percentage of total volume based off of user click.
function setVolume(percentage){
  activeSong.volume = percentage;

  var percentageOfVolume = activeSong.volume / 1;
  var percentageOfVolumeSlider = document.getElementById('volumeMeter').offsetWidth * percentageOfVolume;

  document.getElementById('volumeStatus').style.width = Math.round(percentageOfVolumeSlider) + "px";
}