html5-video

HTML5 Video Not Displaying on iPad

I've encoded a few videos on http://www.theparkerpalmsprings.com to play using HTML5 when loaded via an iPhone or iPad. In my testing, everything works as expected when viewing the site on an iPhone (I've tested on a 3G and iPhone 4), but when loading on the iPad the Quicktime logo flashes quickly and then nothing happens. Is this a prob...

html5 video tag + flash video: how to change priority

hello! i'm playing around with html5 video cause it's nice to have fallback for iphone/ipad. html5 video first checks for <source> elements, if no formats are supported it falls back to whatever content is provided inside the <video> tag (e.g. flash). i'd love to reverse the behaviour to save bandwidth: use flash by default, if not...

Why is PHP interfering with my HTML5 MP4 video?

I'm writing a web app that serves H.264 encoded MP4 video. In Chrome and Safari, it does this via an HTML5 video tag. In order to control access to these videos, their contents are served via PHP using a really simply mechanism: header('Content-type: video/mp4'); readfile($filename); exit; No matter what I do, the videos will not str...

HTML5 Video Duration NaN from Mongrel server but correct time from direct file access.

Accessing following html directly from file system gives me the correct duration. <video src="multimedia/bbb400p.ogv" id="v"></video> <button onclick="alert(document.getElementById('v').duration); document.getElementById('v').play()">Play</button> However, accessing it through mongrel web server (on my machine and th...

When should HTML5 video fall back to Flash player?

Hi. I'm working on implementing a fallback mechanism for the HTML5 video player. I've got a way to replace it with the swfobject Flash player, but how should I detect if any issues have developed? In other words, if we use the following list of error events that can be thrown, which one should trigger the Flash player replacement? Or sh...

HTML 5 Video Problem

I'm trying to set up my site to use HTML 5 videos. The mp4 files are served from S3. I've got the MIME type right, and the URL is right. It's not working though. The only thing I can think of is the codec being wrong. Here is my code: <video width="320" height="240" controls> <source src="{url}" type='video/mp4; codecs="avc1.42E01E, m...

how to play html5 video without using autoplay because it buffers EVERYTHING and slows really down page load

Sample code is at the end of the post for reference. Sorry for being so long winded, just trying to be through and leave no possible relevant info out. This seems like I painted myself in a bit of a corner. I have a show hide toggle function that seems to work fine. I have a small army of DIVs that are each shown and hidden when menu...

File formats for streaming videos in HTML 5 in regular and mobile devices?

I'm putting together a site that will include some instructional videos that will be 1 to 3 minutes long. The users will be accessing these through standard and mobile browsers. I'm particularly concerned with users of i-devices, such as iPhone/iPod Touch/iPad. To deliver the videos, I'm will probably use videojs.com player - it seems l...

How to I retrieve the length in seconds of a <video> element using Javascript?

I have a <video> tag with the id of "liveVideo". How do I retrieve the length of the video in seconds? Thanks, David! ...

Flash and HTML5 the Fallback?

Is it possible to have Flash video first then to fall back to html5? Like I have something like this if(Flash is installed){ run flash player} else if(can do video tag w/ h.264){ use HTML5 video tag with h.264} Now this is javascript so it's being written in javascript, then the inner html will get the right tags. ...

Has anyone used the "onended" function of HTML5 Video Element and if so, how?

I have an intro movie that I want to play full screen and then load a page. I need it to be usable on iPad/iPhone, so I figured I would use HTML's element. Unfortunately, I cannot figure out how to detect the end of the video. I have been told that the onended event would fire, but the DOM description makes it sound like onended is a b...

Flash video record on website tutorial

I wanted to make a website that would let users record a small video message through their broswer and save it to my website. As I have never used flash, i wanted to know what softwares would be required and what programming languages would I need? I mean, what should I go about learning to implement such a site. I would prefer open-sou...

Does iPhone/iPad Safari require 'Accept-Ranges' header for video?

Hello, I've been having problems serving videos from my dev server that play in mobile Safari. My dev server does not support the 'Accept-Ranges' header and after reading a few forums I've discovered that may be my problem. Here is an example forum posting saying just that. Is this correct? Does mobile Safari require the Accept-Ran...

HTML5 video tag on iPhone OS 3 is appearing outside a layer that has overflow: hidden;

I have an HTML5 video tag in a layer that has 'overflow: hidden;' set on it, but the video shows up outside the overflow area. It's essentially an accordion control, so the layer the video is in will be closed by default, and then when activated it will open up with a little slide down animation. Unfortunately, because the video isn't re...

cache video content for offline iphone/ipad web apps in mobile safari (html5)?

i have seen a few (discouraging) questions related to this subject but I am still not clear on the answer. is it possible to cache video content for immediate playback in an offline web app on the iphone or ipad? (i believe that there is a 5mb limit for any cached file.) can videos cache the same way other files can, using the manife...

on the iPad, dynamically created HTML5 video tags wont transform

a video element that was appended will not honor transforms. $parentDIV.append('<video id="myvideo" src="http://site.com//video.m4v"&gt;&lt;/video&gt;'); this transform fails to work on the iPad (but works on the desktop)... $parentDIV.css('-webkit-transform', 'translateX(100px)'); ...

control html5 video player loop with JavaScript

I am looking to enable looping of html5 video in browsers that do not support the loop tag (ff) with JavaScript. Does anyone know the feasibility of accessing the end of the video play and reverting play back to zero? ...

iPad touch events on <video> tag

Hi, I'm building a javascript-powered gallery on the iPad that can display both images and video. To browse the gallery, you can swipe left or right (similar to the iPad's Photo application). However, none of my touch events work when swiping over a <video> element. It seems to take over my touch events, even on elements that may have a...

Has anyone made an HTML5 video playlist that works in iPhone or iPad?

Hi -- I can successfully trap the "ended" event in an HTML5 video like so: onended="do_ended()" And in that function, I can make a playlist that works on desktop Chrome and Safari (yes, also with jQuery and AJAX): function do_ended() { $.get("/nextclip.php",{'id':video_id},function(data){ $("#html5_screen").html('<source ...

Lightbox close button behind Video on iPad (Safari and WebView)

Does anybody know why the close button of the Lightbox is behind the Video and not on foreground on the iPad (Safari browser and WebView in App)? Screenshot: http://i.imgur.com/SYI9w.png With other Elements (Image gallery, Text / HTML) the close button is rendered correctly. On Safari with Mac OS X (not iOS) the close button works co...