i have a video file (avi with avc+mp3). Is it possible to play this via the HTML5 video-tag?
i have tested it in Internet Explorer 9 but it will not work! Is it because the audio codec mp3 is not supported or is it the "video Codec-Profile "HighL3.0"?
Edited to fix misunderstanding
I suggest you do some reading about the ongoing codec wars, or look at this table. Basically, some browsers accept only videos with a MP4 container, H.264-encoded video, and AAC-encoded audio (low-complexity profile); some browsers accept only videos with a WebM container, VP8-encoded video, and ogg-vorbis-encoded audio.
MP4/H.264 seems to be winning the war, but at the moment you'll need both for complete browser support.
Modern browsers which support <video> use WebM, MP4/H.264 and OGG video format. So you can't use AVI for HTML5 video. There is no unique format which is supported by all browsers. The only solution is to convert file to supported formats and use <video> like this:
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4"> <!-- IE, Chrome, Safari, Android -->
<source src="movie.ogg" type="video/ogg"> <!-- Firefox, Chrome, Opera -->
<source src="movie.webm" type="video/webm"> <!-- Firefox, Chrome, Opera, Android -->
Your browser does not support the video tag.
</video>
Related
I can't seem to get the HTML5 video working on the latest version of Mozilla Firefox. It's working on Internet Explorer, Chrome and Safari. Here's the source code
<video id="video" muted autoplay poster="uploads/toaf-video.jpg" controls loop="loop">
<source src="uploads/toaf2014.mp4" type="video/mp4" />
</video>
Thanks,
Try supplying multiple formats to overcome format compatibility differences in different browsers.
<video id="video" muted autoplay poster="uploads/toaf-video.jpg" controls loop="loop">
<source src="uploads/toaf2014.mp4" type="video/mp4">
<source src="uploads/toaf2014.ogg" type="video/ogg">
<source src="uploads/toaf2014.webm" type="video/webm" />
Your browser does not support HTML5 video.
</video>
Why Different formats?
Firefox 3.5+, Opera 10.5+ and Chrome 3+ support ogv
Firefox 4+, Opera 10.6+ and Chrome 6+ support WebM (and ogv,
assuming they don’t drop support in future)
Or Use the flash video to support all major browsers.
Looks like I just had an additional format OGV and WebM.
I have a user requirement to embed mp4 and flv in the website. I have not found any success with this.
I realised that
<video> </video>
does not do the magic.
Is there any other way?
HTML5 does not support .FLV files directly. You will need to convert the .FLV files or use a Flash Player. See the spec for more info
You can, however, embed a .swf file, I believe. See this SO question for more information there.
As for MP4 format, Firefox versions before v21 and Opera do not support it. Opera and older versions of Firefox both support WebM and Ogg Vorbis format for video, however.
To the best of my knowledge, Chrome doesn't support WMV. Opera, Firefox and Chrome support Ogg Theora+Vorbis, while Chrome and Safari support MPEG-4 H.264+AAC.
<video controls>
<source type="video/ogg; codecs=theora,vorbis" src="video.ogv">
<source src="video.wmv">
Your browser doesn't support video, you may download the
video instead: Ogg
</video>
The only browser that might be able to play WMV is Opera on Linux (if you happen to have the right GStreamer plugins installed). That's not very useful, so you should probably just not use WMV with at all.
You might find this useful reading: Everything you need to know about HTML5 video and audio.
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
<object data="movie.mp4" width="320" height="240">
<embed src="movie.swf" width="320" height="240">
</object>
</video>
read more about this : http://www.w3schools.com/html/html_videos.asp
Why You Should Use the MP4 File Format Instead of FLV : http://www.techsmith.com/tutorial-camtasia-why-you-should-use-mp4.html
<video controls>
<source src="video.mp4" type="video/mp4">
<object>
...
</object>
</video>
This HTML5 video tag with a mp4 video and a Flash fallback works in every single browser all over, except from Opera on PC.
But if I move the "object" out of "video", it will work - so that means Flash is properly installed and working.
Is there a solution to this, or do I have to make some sort of a workaround by checking for browser and then displaying a pure Flash player for Opera?
The Flash fallback only works on old browsers that can't process the <video> element natively - but that doesn't include Opera. Opera tries to play your HTML5 media... and fails.
Your issue is that Opera can't play the mp4 file. Try adding a fallback webm version to support it:
<video controls>
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
<object>
...
</object>
</video>
Video html5 does not work in all browsers except google chrome.
Firefox display: No video with supported format and MIME type found
Html in page:
<video width="320" height="240" controls>
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type="video/mp4">
</video>
According to W3 schools, only MP4 is not supported on Firefox. So if you are trying to display MP4, don't expect much from it. Also, Opera and Firefox offer build-in decoding for this feature.
I’m using this code in Google Chrome and the video is working well, but in Firefox (version 11) it’s not working.
How can I make it work in Firefox?
<!DOCTYPE html>
<html>
<body>
<video width="300" height="200" controls="controls">
<source src="http://localhost/javascript/test.mp4" type="video/mp4" />
</video>
</body>
</html>
Firefox doesn't support mp4 as encoding for the video. Have a look at MDN for a compatibility table.
You would have to provide additional encoding for Firefox to work (like this example taken from MDN as well):
<video controls>
<source src="somevideo.webm" type="video/webm">
<source src="somevideo.mp4" type="video/mp4">
I'm sorry; your browser doesn't support HTML5 video.
<!-- You can embed a Flash player here, to play your mp4 video in older browseres -->
</video>
UPDATE 01/19/2016:
Now Firefox supports mp4 video formats. So this question should be automatically answered because of update by Firefox browser. Please let us know if your video still does not work.
Since version 4, Firefox only supports WebM, VP8 and Vorbis video format. (Firefox 3.5 supports Ogg, Theora and Vorbis.)
See:
https://developer.mozilla.org/En/Media_formats_supported_by_the_audio_and_video_elements.
http://diveintohtml5.info/video.html#what-works
You’ll need to create another version of your video in a Firefox supported format, and add another <source> element for it.
For an example, see:
http://diveintohtml5.info/video.html#example