html5-video

I am trying to trim the length of a video within the browser, from either the beginning or the end. What I currently have is a MediaStream which is being recorded using the MediaRecorder API, which I use to produce a Blob at the end of the recording with type set to 'video/mp4'. This works great and I am able to play the video back, however I would like a way to trim the video either at the start or end. Upon further investigation of the MediaStream API I came across the SourceBuffer object, that you can obtain from a MediaStreamTrack and use it to remove a time slice, which is exactly what I

I am trying to get a .m4v video to play in IE9 using html5 video tags. When I play the video from a remote location it works fine: <video src="http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer_480x270_h264aac.m4v" controls="controls"> </video> But when I want to play it from my server... <video src="Big_Buck_Bunny_Trailer_480x270_h264aac.m4v" controls="controls"> </video> ...it only works in Chrome and not in IE9. What could cause the video not to play when located on my server? Many thanks, Chris In addition to needing the server to send the correct Content-Type header for the requested

some background I've tested my video in FF and Safari (including iDevices) and it plays properly, but it will not play in the Chrome browser. As you can see in the code below, I've created mp4, m4v, webM, and ogv files, and I've tested all of them on my computer for any playback issues. the symptoms/issue In Chrome, the video seems to load, and there are no errors in the console log . When the play button is pressed, it loads a portion of the file, but then does not play it. Yet, interestingly, if I arbitrarily click on a later time in the time-bar, say about halfway through, it will play

I have a video, and I want it to FILL 100% of the width, and 100% of the height. And keep the aspect ratio. Is it possible that it at least fills 100% for both? And if a bit of the video has to be out of the screen to keep the aspect ratio, that doesn't matter. HTML: <video preload="auto" class="videot" id="videot" height="100%" preload> <source src="BESTANDEN/video/tible.mp4" type="video/mp4" > <object data="BESTANDEN/video/tible.mp4" height="1080"> <param name="wmode" value="transparent"> <param name="autoplay" value="false" > <param name="loop" value="false" > </object> CSS: .videof,

I've made custom controls for my HTML5 video but I don't know how to have that CSS still apply when I go fullscreen. Here's the [website] I've based my controls on. On this site, you'll notice that when you click the fullscreen button the custom controls get lost and the video reverts to the default <video> controls. Does anyone know how to have these custom controls styling/CSS still apply when you go fullscreen? i answered my own question, the key is that the custom controls are inside the <div> that includes the video that you want to take full screen. In my code below, this <div> is called

I am having trouble getting a working example that reads metadata from a WebVTT file, which was specified by the <track> element of a <video> in an HTML5 page. To be clear, I am not talking about reading the metadata out of the video file itself (as you would with an MPEG Transport Stream, for instance). What I'm talking about is the <track> element that is used for captioning videos. One of the attributes of a <track> is kind , which can be specified as any of the following values: Subtitles Descriptions Captions Navigation Chapters Metadata I am trying to use the metadata type to access text