Audio Show preloader until audio starts.
HTML
<audio id="player" src="https://www.dieselpunkindustries.com/radio_shows/the_adventures_of_superman/460626_-_1320_-_Clan_Of_The_Fiery_Cross_Pt_13.mp3"> </audio>
<span id="button" audioUrl="https://www.dieselpunkindustries.com/radio_shows/the_adventures_of_superman/460626_-_1320_-_Clan_Of_The_Fiery_Cross_Pt_13.mp3">play</span>
<span class="pause">stop</span>
<span class="loading">Loading...</span>
CSS
.loading{
display:none;
position:relative;
}
JAVASCRIPT
$(document).ready(function() {
$( ".pause" ).click(function() {
document.getElementById('player').pause();
});
$( "#button" ).click(function() {
$('.loading').show();
$('#player').attr("src", $(this).attr("audioUrl"));
document.getElementById('player').play();
});
var audioLoader = document.getElementById("player");
audioLoader.onplaying = function() {
$('.loading').delay(2000).hide('slow');
};
});
