I'm building a web page and want to add HTML video. It works fine in Chrome etc., but not in Firefox. I can hear the sound, but firefox is unable to show the picture, I get grey screen instead.
I've got Firefox 25.0.1
Here is my code:
<figure id="video">
<video width="320" height="240" controls>
<source src="vid/asd.mp4" type="video/mp4">
<source src="vid/asd.ogg" type="video/ogg">
Sorry Your browser cannot play HTML5 video.
</video><br/>
<img src="img/pic.jpg" alt="Pics"/>
<figcaption>Some text here
<br/>size: 6,95MB</figcaption>
</figure>
<video> works for me in Firefox 25.0.1/Windows Vista. Maybe it's a problem with a movie? Try this demo.
Also, from the Mozilla website:
To avoid patent issues, support for MPEG 4, H.264, MP3 and AAC is not built directly into Firefox on desktop and mobile (Android and Firefox OS). Instead it relies on support from the OS or hardware.
Interesting well ask yourself what version of firefox your running and take a look at
http://www.videojs.com/
Hope that helps ^_^
Well honestly I use firefox also but, Hmmm. Well remember to always to put .mp4 first! Because if not that creates some interesting bugs for ios...
This was a school project, just found out that the school's servers are not able to auto-get the MIME type under firefox. I had to add .htacces file
Related
I tried to make a fan-website for a artist so I wanted to have start page music which automatically plays. But, when I open the start page, my audio file doesn't play.
This is my code:
<audio controls autoplay loop>
<source src="https://s3.amazonaws.com/Syntaxxx/bigger-picture.mp3" type="audio/mpeg" />
<p>If you can read this, your browser does not support the audio element.</p>
</audio>
What I need to do to make this start playing automatically?
autoplay is a html standard. It's up to then browser to support it or not. I suspect you used Chrome, like so many others, and were surprised it didn't work.
https://www.w3schools.com/tags/att_audio_autoplay.asp
If you test this code, like I did, in Firefox 63, it will work fine.
Google decided to break the web standard in May 2018:
https://bugs.chromium.org/p/chromium/issues/detail?id=840866#c103
As of 2020, browser defaults mean this won't work in Firefox (all platforms) and Chrome (Android included, but not Mac it seems).
it depends on your browser's [here Firefox]
Autoplay preferences (blocked or not) in
about:preferences#privacy
I am trying to add a video tag to get a video player with my video like this
The video shows up fine sometimes as shown above, but most of the time it shows up weird and not functional as shown below
No matter if I click play or not, it just does not work.
Here is my code
<div class="detailRight">
<video id="video1" width="515" height="300" preload controls>
<source src="../files/MyVid1080.mp4" type="video/mp4">
</video>
</div>
I'm not sure why it works sometimes and sometimes it does not. How do I get past this bug?
EDIT1
Above is in Chrome, in Safari it is working fine, in Firefox it is giving me
in order to support all browsers i would recommend using .ogv .webm and .mp4 formats this should solve your problems their are a couple of online sites that will convert your video for free
I have the following code:
<div class="span4">
<video poster="assets/img/poster.jpg" controls="controls" width="420" height="420">
<source src="assets/videos/152638831.webm" type="video/webm" />
<source src="assets/videos/152638831.mp4" type="video/mp4" />
</video>
</div>
The video works in both Firefox and chrome, but in Chrome, it's very very grainy. I don't think it's an issue with my video because when I navigate to http://www.w3schools.com/html/html5_video.asp using Chrome, the video under the section called "DOM Methods and Properties" also appears grainy. When i say grainy, I mean, I see yellow, green, blue and red lines / dashes spattered across the video.
Can you tell me what I'm doing wrong?
Also, is the idea behind having multiple source tags that depending on the browser, it will select which file to play? In my case, I know firefox doesn't support mp4... I tested it. but the above code works in firefox. So I'm assuming it's playing the webm version of the file. Is this correct?
Thanks.
First of all, Chrome should be able to read the mp4 so perhaps you didn't use h264 compression.
You should check on that.
Second, you must include compressed ogv, and webm versions of the video.
Each browser supports a different video format at the moment so we have to include them all so that no one gets left out.
Here is a handy chart for browser video format support :
http://www.longtailvideo.com/html5/#media_formats
Don't forget the flash fall-back either, just incase someone with a dinosaur browser that doesn't support the html5 video tag needs to see the video too.
Here is a handy chart for video tag support :
http://caniuse.com/video
Let us know how you get on.
Im in the process of making a webpage, and im trying to insert a video. The video player loads fine, and you can press play, but only the audio plays, not the video. (When previewing in chrome)
When viewing in firefox it works properly
My code is as follows...
<video width="600" height="400" controls>
<source src="ds2.mp4" type="video/mp4">
<source src="ds2.ogv" type="video/ogv">
<source src="ds2.webm" type="video/webm">
Your browser does not support the video tag.
</video>
My Doctype is <!Doctype html>
I checked the MIME type, its Video/mp4. however, one of the mime requests is in red and cancelled (When checking with google dev tools networking)
Im using microsoft expression web 4 (incase it is relevant)
If i've neglected any important information please let me know and ill update the post :) Thanks in advance for your help :)
Your problem is with the file encoding. HTML5 supports very few types and, sadly, every browser can play only part of this narrow list.
If you convert your mp4 file to H.264 encoding it will work on chrome and IE9 and above, but apparently due to patent issues, firefox does not support it but will play it if the OS can play it. This is really annoying and still require the use of players in order to play files in not-supported browsers.
I am trying to play a video in safari 5 but its just showing me a blue question mark button, no video place holder no video controls (like in chrome)
<video poster='your_pic.jpg' controls="">
<source width='480' height='360' src='/videos/my file to play.m4v' />
</video>
For safari to play videos on windows you have to install apple quick time.
http://www.agilepman.com/2010/09/how-to-make-html5-video-tag-work-in-safari-on-windows/
I'm not familiar with the syntax you have used, i.e. a source tag within the video tag. I would expect a video reference to look more like this:
<video controls="true" poster="some-image.png" src="some-video.mp4"></video>
Does the video work as expected in Chrome? Looking at the controls that do get rendered, the difference between Chrome and Safari seems to be down to embedded Quicktime (i.e. Safari uses it if it can, Chrome does not).
One other thing: if the file just doesn't play anywhere, bear in mind that .m4v files are often MPEG4 files with Apple's Fairplay DRM applied to them (although they don't have to be).