html5 display audio currentTime

Question

I would like to display the current time of of an html 5 audio element and the duration of that element. I've been looking over the internet but can't find a functional script which allows me to display how long the audio files is and what the time currently is e.g. 1:35 / 3:20.

Any one got any ideas :)?

Answer 1

Here's an example:

<audio id="track" src="http://upload.wikimedia.org/wikipedia/commons/a/a9/Tromboon-sample.ogg"        ontimeupdate="document.getElementById('tracktime').innerHTML = Math.floor(this.currentTime) + ' / ' + Math.floor(this.duration);">     <p>Your browser does not support the audio element</p> </audio> <span id="tracktime">0 / 0</span> <button onclick="document.getElementById('track').play();">Play</button> 

This should work in Firefox and Chrome, for other browsers you'll probably need to add alternative encodings.

Answer 2

here is simple usage. keep in mind html5 elements are still in the works so anything can change:

    audio = document.getElementsByTagName("audio")[0];      //functions     audio.load();     audio.play();     audio.pause();      //properties     audio.currentSrc       audio.currentTime       audio.duration 

here is the reference HTML5 Audio

to get the currentTime while audio is playing you must attach the timeupdate event and update your current time within the callback function.

simple tutorial audio/video html5 on dev.opera