I have a website that uses the HTML5 video tag;
<video id='video' autoplay muted loop controls>
<source src="video/homevideo.mp4" />
</video>
The video is playing on Firefox and Chrome but not at all in Safari (desktop, iPhone etc). MP4 should be supported and work on Safari.
The same problem has already been discussed here: HTML5 Video tag not working in Safari , iPhone and iPad
Either it has to do with a MimeType issue or the web server does not support HTTP byte-range requests.
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).
I have created a mp4 video and called it in the below html5 video tag as follows
<video width="100%" autoplay="" loop="">
<source src="http://beta.jointviews.com/testbytes/wp-content/themes/zerif-lite/videos/testbytes.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
the video works fine in mozilla and chrome but not in safari and mobile devices specially on androids and ipod,ipads{i could check only in these)
i have read in the link that safari supports mp4 but it is not
here is the fiddle
http://jsfiddle.net/Lqaro0vr/
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