Html video controll doesn't work on Firefox - html

I'm trying to display a video on my website. Here is the code:
<video controls>
<source src="my_location.mp4" type="video/mp4" />
<source src="my_location.ogv" type="video/ogv" />
<source src="my_location.webm" type="video/webm" />
Your browser does not support this content
</video>
It worked for all browser but the problem is that the pause button on Firefox does not work event if I have the controls attribute on my video and ogv format.
Does someone know why ?

There is no dedicated pause button - instead the play button is toggled with a pause button after it's clicked. See also the example at w3schools.com:
http://www.w3schools.com/HTML/html5_video.asp
ADDITION:
This in your code:
<source src="my_location.ogv" type="video/ogv" />
should be
<source src="my_location.ogv" type="video/ogg" /> .
(ogg instead of ogv on the file type / not on the file extension itself).

Related

HTML Audio component controls not showing download in Safari

I have an audio component declared in React with controls like this:
<audio controls>
<source src={url} />
</audio>
This is working in all the browsers except Safari. When I try to use the audio controls it only appears the speed of the audio (0.5x, 1x, 1.25x, etc...) but there is no download option.
What am I missing?
try adding more Media container formats on order to support more platforms and browsers :
<audio controls>
<source src={url} type="audio/mpeg" />
<source src={url} type="audio/ogg" />
</audio>

HTML5 video not playing only in chrome

i am using this code to play a video in a wordpress website.
the code workes perfectly in all browsers but in chrome controls are disable and the video is not playing.
any where else but that site the code works in chrome.
changing the theme and disabling plugins did not solve the problem.i have changed the code and the format of videos several times but nothing works on that.
<video width="320" height="240" controls="controls">
<source src=" test.mp4" type="video/mp4" />;
<source src=" test.ogv" type="video/ogg" />;
<source src=" test.webm" type="video/webm" />;
</video>
well, the problem really was ssl.
I just activated ssl on my download host and the video played nice and easy.
thank you so much for your hint rank. if this link was not: https://w3schools.com/html/tryit.asp?filename=tryhtml5_video
i still was searching for the problem on my website.
Have you already tried eding the syntax?
You should definately delete the semicolons after the source tags. This is Html, not a javascript code, so there should be no semicolons.
Also you can set the boolean attribute of controls with giving no value, simply put the "controls" inside the tags.
Give this a try, maybe it solves your problem with chrome:
<video width="320" height="240" controls>
<source src=" test.mp4" type="video/mp4" />
<source src=" test.ogv" type="video/ogg" />
<source src=" test.webm" type="video/webm" />
</video>
I know this has been answered, but a note on your source files. Browsers select the first file they "know how to play".
Since every browser that supports video also supports mp4, you'll never actually see any playback of the ogg or webm versions of the video. I would suggest:
<video width="320" height="240" controls>
<source src=" test.webm" type="video/webm" />
<source src=" test.ogv" type="video/ogg" />
<source src=" test.mp4" type="video/mp4" />
</video>
(and since webm and ogg fully overlap - you can probably save yourself from creating the ogg files altogether)

HTML video tag not working on edge

I using a simple HTML5 to play mp4 file but it says this file is not supported only on microsoft edge
I have followed this link https://learn.microsoft.com/en-us/microsoft-edge/dev-guide/html5/video here is my code:
<video width="500" height="300" controls autoplay loop>
<source src="video/video.mp4" type="video/mp4" />
<source src="video/video.webm" type="video/webm" />
<source src="video/video.ogv" type="video/ogg" />
Your browser does not support HTML5 video.
</video>
It works fine on opera, chrome and firefox
There is the possibility the mp4 file is in the newer H265 / HEVC format which is not supported in Windows 10, Edge or the Movies and Photos App
If the title of the mp4 file contains H265 or HEVC, then you will need to download a media player that supports this new format.
Also you can see more here Microsoft Edge and <VIDEO>
What version of edge are you running?
You could create a you tube video and then include it that way.
<iframe width="420" height="315" src="https://www.youtube.com/embed/tgbNymZ7vqY"></iframe>
Source tags are empty elements and should not be closed. Remove the closures like so:
<source src="video/video.mp4" type="video/mp4">
<source src="video/video.webm" type="video/webm">
<source src="video/video.ogv" type="video/ogg">

video not loading in html5

I'm having a problem with the HTML5 video player, doesn't show the video, in a html file I have:
<video>
<source src="video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
Video tag not supported.
<video>
I even tried without the codec atributte in chrome I gets nothing, only the black square of the reproductor
the file video.mp4 is inside the same folder of the html, it doesn't even show a preview, nothing!
It should work with HTML5 video tag perfectly. I've put an example for your reference.
<video controls="" autoplay name="media">
<source src="http://www.html5rocks.com/en/tutorials/video/basics/devstories.mp4" type="video/mp4;codecs="avc1.42E01E, mp4a.40.2"">
</video>
This should work perfectly:
<video width="300" height="200" controls>
<source src="movie.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>

Why isn't my audio element working in HTML5?

I am using the chrome 37 and firefox 31.
When I add the audio tag for chrome. It just doesn't play. There is a cross over the sound control icon
On firefox v31 it just disappears. When I check th w3schools website it works fine. I am using exactly the same code they are using with and doubled check the audio src to make sure its correct but it still doesn't play. Can anyone please help me figure out whats going on??
Below is my code
<audio controls>
<source src="new_simplemenu_order.mp3" type="audio/mpeg" >
Your browser does not support the audio element.
</audio>
I was having the same problem.
It seems to work by if you change your file type to .ogg and also don't use underscores in your file name.
Also, try altering your code to this (credit to superuser.com):
<audio controls preload="auto">
<source src="NewSimpleMenuOrder.ogg" type="audio/ogg" />
</audio>
You can hide the controls by doing the following
<audio preload="auto">
<source src="NewSimpleMenuOrder.ogg" type="audio/ogg" />
</audio>
And autoplay by doing this:
<audio autoplay>
<source src="NewSimpleMenuOrder.ogg" type="audio/ogg" />
</audio>
(I hope this fixes your problem!)