HTML5 Video - Percentage Loaded?

Question

Does anyone know what event or property I need to query in order to get a percentage figure of the amount an HTML5 video has loaded? I want to draw a CSS styled \"loaded\" b

Answer 1

The other awnsers didn't work for me so I started digging into this problem and this is what I came up with. The solutions uses jquery to make an progressbar.

function loaded()
{
    var v = document.getElementById('videoID');
    var r = v.buffered;
    var total = v.duration;

    var start = r.start(0);
    var end = r.end(0);

    $("#progressB").progressbar({value: (end/total)*100});      
}   

$('#videoID').bind('progress', function() 
{
    loaded();
}
);

I hope this helps others as well