UPDATE: Ok so although I haven't solved this problem exactly, but I did figure out a work around that handles my biggest concern... the user experience. First the video doesn't begin loading until after the viewer hits the play button, so I am assuming that the duration information wasn't available to be pulled (I don't know how to fix this particular issue... although I assume that it would involve just loading the video metadata separately from the video, but I don't even know if that is possible). So to get around the fact that there is no duration data, I decided to hide the duration info (and actually the entire control) completely until you hit play. I know... its cheating. But for now it makes me happy :) That said... if anyone knows how to load the video metadata separately from the video file... please share. I think that should completely solve this problem. I am working on building a HTML5 video player with a custom interface, but I am having some problems getting the video duration information to display. My HTML is real simple (see below) <video id="video" poster="image.jpg" controls> <source src="video_path.mp4" type="video/mp4" /> <source src="video_path.ogv" type="video/ogg" /> </video> <ul class="controls"> <li class="time"><p><span id="timer">0</span> of <span id="duration">0</span></p></li> </ul> And the javascript I am using to get and insert the duration is var duration = $('#duration').get(0); var vid_duration = Math.round(video.duration); duration.firstChild.nodeValue = vid_duration; The problem is nothing happens. I know the video file has the duration data because if I just use the default controls, it displays fine. But the real strange thing is if I put alert(duration) in my code like so alert(duration); var vid_duration = Math.round(video.duration); duration.firstChild.nodeValue = vid_duration; then is works fine (minus the annoying alert that pops up). Any ideas what is happening here or how I can fix it?