Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

html audio tag, duration always infinity

Tags:

People also ask

How does an HTML audio tag works?

HTML Audio - How It WorksThe controls attribute adds audio controls, like play, pause, and volume. The <source> element allows you to specify alternative audio files which the browser may choose from. The browser will use the first recognized format.

How do I style an audio tag in HTML?

HTML 5 audio tags can be styled. By using the audio tag with “controls” attribute, the default browsers player is used. You can customize by not using the browsers controls. You can also add CSS classes to each one of the elements and style them accordingly.

What are the two attributes of audio tag?

Audio Tag Attributes The attributes for the audio tag are: Autoplay: It ensures that the audio would start to play as soon as it is loaded on the webpage. Controls: It specifies that the audio controls such as the play and pause button would be displayed on the webpage.


I've been working on using the html audio tag to play some audio files. The audio plays alright, but the duration property of the audio tag is always returning infinity.

I tried the accepted answer to this question but with the same result. Tested with Chrome, IE and Firefox.

Is this a bug with the audio tag, or am I missing something?

Some of the code I'm using to play the audio files.

javascript function when playbutton is pressed

function playPlayerV2(src) {
document.getElementById("audioplayerV2").addEventListener("loadedmetadata", function      (_event) {
console.log(player.duration);
});
var player = document.getElementById("audioplayer");

    player.src = "source";
    player.load();
    player.play();
}

the audio tag in html

<audio controls="true" id="audioplayerV2" style="display: none;" preload="auto">

note: I'm hiding the standard audio player with the intend of using custom layout and make use of the player via javascript, this does not seem to be related to my problem.