html5-video

With an HTML5 video element on the iphone, how can I detect the difference between “pause” and “done”?

☆樱花仙子☆ 提交于 2019-11-28 20:48:37
This is an extension of this question According to my research, for a video element on an iPhone/iPad, pressing both "Done" and "Pause" triggers a "pause" event. So if I have some desired webpage behavior that I want to initiate upon pressing the "done" button, I need to listen for the "pause" event. player = document.getElementById('videoplayer'); player.addEventListener("pause", function() { //desired "done button" behavior defined here }, false); According to Arv-ToolTwist's answer to that original question, the way one differentiates between "done" and "pause" is by checking for the

Howto Play YouTube videos via HTML5 video tag

限于喜欢 提交于 2019-11-28 18:47:33
This code works for a moment but i think the links changes, cause the next day it is not found? the video played under Firefox/Chrome/Opera... how to make the video tag play this video permanently?! <video width="480" height="270" controls="controls" style="color:green;"> <source src="youtubelink" type="video/mp4"> <source src="youtubelink" type="video/ogg"> <source src="youtubelink" type="video/webm"> Your browser does not support the video tag. </video> brianchirls There isn't really a reliable way to actually play a YouTube video inside a real video tag. YouTube doesn't want you doing that,

Capturing Video Frame and then Exporting as Bitmap in HTML5

筅森魡賤 提交于 2019-11-28 18:27:06
I have a web application where I play back video. I am considering using the HTML5 <video> element and have determined it will allow me to meet all of my requirements except one: allowing the user to take a snapshot of the current video frame and save it as a raster image format (i.e. JPG). For this requirement I have not found a solution, and any guidance on this matter would be greatly appreciated. To help answer the question here are more details. I will download the video files from a server via HTTP and then play them back in the browser. This will not be a video stream, but instead a

HTML5 video seeking

纵饮孤独 提交于 2019-11-28 18:25:32
How can I get my video player to skip/seek to a certain time. I have had a go at this and it works when the page first loads (In Chrome) but not in any other browser. I also have a flash fallback which could be a pain, but for now the priority is the HTML side of things The major issue is that it doesn't work outside Chrome! EDIT: This now works in IE9, Chrome and Firefox. However, not with the flash fallback! Below is my attempt so far. I'm using the following JS so far: <script language="javascript"> $(function () { var v = $("#video").get(0); $('#play').click(function(){ v.play(); }); $('.s

Look for fastest video encoder with least lag to stream webcam streaming to ipad

笑着哭i 提交于 2019-11-28 17:56:38
问题 I'm looking for the fastest way to encode a webcam stream that will be viewable in a html5 video tag. I'm using a Pandaboard: http://www.digikey.com/product-highlights/us/en/texas-instruments-pandaboard/686#tabs-2 for the hardware. Can use gstreamer, cvlc, ffmpeg. I'll be using it to drive a robot, so need the least amount of lag in the video stream. Quality doesn't have to be great and it doesn't need audio. Also, this is only for one client so bandwidth isn't an issue. The best solution so

Is it possible to check if the user has a camera and microphone and if the permissions have been granted with Javascript?

有些话、适合烂在心里 提交于 2019-11-28 17:19:09
I would like to find out if the user's device has an attached camera and microphone, and if so, has permissions been granted to get the audio and video stream using Javascript. I want to make this check to be made across Chrome and Firefox at the very least. What's a consistent API for this? Live Demo: https://www.webrtc-experiment.com/DetectRTC/ If user didn't allow webcam and/or microphone, then media-devices will be having "NULL" value for the "label" attribute. Above page will show this message: "Please invoke getUserMedia once." PS. You can type "DetectRTC.MediaDevices" in the Chrome

How to fill video element with poster image even if the poster image is a different aspect ratio than its video element? [duplicate]

旧时模样 提交于 2019-11-28 17:13:28
问题 This question already has answers here : Make HTML5 video poster be same size as video itself (12 answers) Closed 6 years ago . As it stands right now, this is only tested in WebKit. When a poster image is set on a <video> element using the poster attribute, this image displays before the user plays the video (default behavior). However, if the poster image is of a different aspect ratio than that of the <video> element that it is set on, whitespace (or possibly blackspace) is seen on either

How to set the thumbnail image on HTML5 video?

生来就可爱ヽ(ⅴ<●) 提交于 2019-11-28 16:46:41
Is there a way to set thumbnail image on HTML5 video? I want to see some pictures before play. My code looks like this: <video width="470" height="255" controls> <source src="video.mp4" type="video/mp4"> <source src="video.ogg" type="video/ogg"> <source src="video.webm" type="video/webm"> <object data="video.mp4" width="470" height="255"> <embed src="video.swf" width="470" height="255"> </object> </video> Thanks! Jason Brooks Add poster="placeholder.png" to the video tag. <video width="470" height="255" poster="placeholder.png" controls> <source src="video.mp4" type="video/mp4"> <source src=

How do I get a snapshot still of a video in nodejs?

折月煮酒 提交于 2019-11-28 16:31:54
问题 I am trying to write a nodejs server that will take a time input (possibly part of url path) and then provide a still of the video frame at that time index as a jpeg picture. I can do this easily in plain Javascript, but I cant see a way to do this in nodejs. I know I will probably need to use a canvas plugin like node-canvas to do the snapshot. Any ideas welcome. The following is how I do it in Javascript at the moment: myjavascript.js function capture(video, scaleFactor) { if(scaleFactor ==

HTML5 frame-by-frame viewing / frame-seeking?

ぃ、小莉子 提交于 2019-11-28 15:35:04
I'm looking for a way to view HTML5 <video> , frame-by-frame. The scenario: Having a video, with an additional button that skips to the next frame when pressed. What do you think is the best method to do this? Play the video normally, Listen to timeUpdate event, which on FireFox is called for every frame , and then just pause the video. However, the other browsers don't behave like Firefox. Change the currentTime element manually to +1/24 of a second, where "24" is the frame rate. I have no idea how to aquire the FPS, however. Any other helpful way you can think of. EDIT I have found this very