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.
Related
Trying to get this code to have functioning controls in Safari and Firefox. The controls show up just not responsive. Code works fine in Chrome.
<span class="device image fit"><section id="video">
<video src="images/Compassionate%20Release%20Healthcare%20Network.mp4" width="100%" controls="true">
</video>
</span>
Thanks,
The code is missing a close tag for the section tag. This may throw off the parser in some browsers.
Simply add one or remove the existing opening tag:
<span class="device image fit">
<section id="video">
<video src="..." width="100%" controls="true">
</video>
</section> <!-- add this -->
</span>
The problem is you are trying to use .mp4 format only, which is not supported in all browser.
You need to provide a different movie format and create some fallbacks for mobile devices or other browsers.
Try writing your <video> element like this:
<video controls>
<source src="somevideo.webm" type="video/webm">
<source src="somevideo.mov" type="video/mov">
<source src="somevideo.mp4" type="video/mp4">
I'm sorry; your browser doesn't support HTML5 video
</video>
This will be supported by most desktop and mobile browsers.
.mov - supported by Safari, iOS Safari.
.mp4 - supported by Chrome,
Android Chrome and Android Browser, IE.
.webm - supported by Firefox, Chrome and IE.
For further reading, check out this article.
So on my website I have one small video, I have two file types, mp4 and webm. Webm seems to be working for mozilla, chrome, while mp4 works on explorer, and should work on Safari. It doesn't. I can't grasp what it is, I've tried to add .ogg and .mov tags, still not working, I added the extensions to htaccess, still nothing.
<video width="600" height="400" controls>
<source src="img/sms.mp4" type="video/mp4">
<source src="img/sms1.webm" type="video/webm">
Your browser does not support the video tag.
</video>
This is the code, works everywhere except safari, which makes it not work on any apple devices, as far I'm aware(tested on an iPhone, not working).
my code:
<video width="600" height="400" controls="controls">
<source src="uploads/video/patientenhandset_uk_high.mp4" type="video/mp4" />
<source src="uploads/video/patientenhandset_uk_high.ogg" type="video/ogg" />
Your browser not supported this video.
</video>
This code IE10, IE9, firefox and opera works. So why does not work in chrome?
I believe Chrome uses the WebM format (video/webm), so you'll probably need to offer this as another <source> alternative.
That code looks fine. Are you serving the right mime type for mp4?
The latest chrome plays HTML5 video fine, so you have something wrong, but it doesn't appear to be in your HTML. You may also want to try switching your source tags to using a fully qualified domain name, like http://www.yourdomain.com/yourvideo.mp4
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>
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