html5 video only works in safari - html

Im new to HTML 5 and learning from w3schools
I tries to get the html video code working for a file I have. Trouble is that the html only works in safari but not the other browsers I have.
Any ideas please?
thanks
<!DOCTYPE html>
<html>
<body>
<video width="320" height="240" controls="controls">
<source src="candonjoel.mp4" type="video/mp4" />
<source src="candonjoel.webm" type="video/webm" />
<source src="candonjoel.ogg" type="video/ogg" />
Your browser does not support the video tag.
</video>
</body>
</html>

Does candonjoel.webm exist? Can you show the URL of your code please?
https://github.com/kaihendry/recordmydesktop2.0/ is project to make screencasts easier from Linux to all browsers.

Related

Autoplay attribute of video element of HTML 5 working in Firefox but not in Chrome or Opera

I have the following code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<video width="400" autoplay>
<source src="../Videos/mov_bbb.mp4" type="video/mp4">
<source src="../Videos/mov_bbb.ogg" type="video/ogg">
<source src="../Videos/mov_bbb.webm" type="video/webm">
Your browser does not support autoplay HTML5 video tag.
</video>
<p><span>Video courtesy of </span>Big Buck Bunny</p>
</body>
</html>
Upon opening the file in Firefox everything is working as expected.
But, upon opening the file in Chrome or Opera a still image is coming and nothing is happening.
Why is it so?
I am using Ubuntu 18.04
A bit of a workaround. Adding the following after the closing /video tag could work.
<script>
document.getElementById('vid').play();
</script>
Does that work for you?
EDIT: After some extra digging I stumbled across this post https://stackoverflow.com/a/42414858/6524598. It seems to be the case that chrome only respects autoplaying of a video if the audio of it is muted. This would mean that the following would perhaps work for you as well:
<video width="400" autoplay muted >
<source src="../Videos/mov_bbb.mp4" type="video/mp4">
<source src="../Videos/mov_bbb.ogg" type="video/ogg">
<source src="../Videos/mov_bbb.webm" type="video/webm">
Your browser does not support autoplay HTML5 video tag.
</video>

HTML video not working

I am trying to get a video to play locally but it isn't working. the file is 'wildlife.mp4,' however, it doesn't play it is just a blank video box? Any help will be much appreciated, thanks.
<!DOCTYPE html>
<html>
<head>
<title>video</title>
</head>
<body>
<video width="320" height="240" controls>
<source src="wildlife.mp4" type="video/mp4">
<source src="wildlife.ogg" type="video/ogg">
Your browser does not support the video tag.
</body>
</html>
Video tag is not closed.
Add autoplay if you want the video to play automatically.
<!DOCTYPE html>
<html>
<head>
<title>video</title>
</head>
<body>
<video width="320" autoplay="autoplay" height="240" controls>
<source src="wildlife.mp4" type="video/mp4">
<source src="wildlife.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</body>
</html>
If you are running the script on Windows the browser can check the file type associated with the video ( wildlife.mp4 ). On my system ( W7) I clicked the -Properties- on the video file and CHANGed the -Type of file- from VLC (which is the default on my system) to Windows Media player and all was sorted.
Hope this helps.

How to put video on Website

I am new to working with videos and what i'm trying to accomplish is putting a video on my site. I have been researching and havent found to much, any help would be very much appreciated. Here is what I have so far.
<embed "images/K36U21TR.wmv" width="300" height="300" />
My preffered method is to upload the video to YouTube and place it on your site using their embed code which is an iframe tag.
This provides the benefit of your users using YouTube's bandwidth when they are watching the video rather than yours.
Alternatively you could look at using the HTML5 VIDEO tag.
http://www.w3schools.com/tags/tag_video.asp
<video width="300" height="300" controls>
<source src="images/K36U21TR.wmv" type="video/wmv">
</video>
video tag : (Supprot : IE, Firefox, Chrome, Opera, Safari)
<video width="320" height="240" controls="controls">
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
</video>
embed tag : (Supprot : IE, Firefox, Chrome, Opera, Safari)
<embed src="helloworld.swf">

html5 video plays on all browsers except IE9

I wanted to post this question and answer because I wasn't able to find it anywhere.
So if you are playing with HTML5 <video> on the different browsers make sure the rest of your HTML is valid such that your video will play on IE9.
The following code works on Chrome 19, Firefox 12, Opera11, as well as iOS5 but NOT IE9:
<video controls="controls">
<source src="video.mp4" type="video/mp4" />
<source src="video.ogg" type="video/ogg" />
Your browser does not support the video tag.
</video>
First check whether your browser support HTML 5 Video or not
Check browser supporting video or not
To get it to play on IE9,
You need this full markup:
<!DOCTYPE html>
<html lang="en">
<head></head>
<body>
<video controls="controls">
<source src="video.mp4" type="video/mp4" />
<source src="video.ogg" type="video/ogg" />
Your browser does not support the video tag.
</video>
</body>
</html>

In firefox I am not able to open video tag

<!DOCTYPE HTML>
<html>
<body>
<video width="320" height="240" controls="controls">
<source src="tutorial.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
</body>
</html>
this tutorial.mps is stored in the same folder but I am not able to open that video I got that sentence Your browser does not support the video tag.
See this link about media format browser compatibility. The firefox doesn't support mp4 yet. Convert the file e.g. to ogg and add an additional source-tag.