<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><title>Video</title>
<style type="text/css"></style>
<link rel="stylesheet" href="css.css" type="text/css">
</head>
<body>
<div id="Content"><br>
<video width="854" height="480" controls="controls">
<source src="MyMovie.mp4" type="video/mp4">
stuff
</div>
</body>
</html>`
When I view this on Google Chrome I get the video, but none of the buttons can be pressed and the video doesn't start.
If you don't see the buttons, this is probably an issue related with your CSS.
To have the video start automatically, use the parameter autoplay="autoplay" (parameters of HTML5 video):
A demo of a working video in JsFiddle.
Working code:
<div id="Content"><br>
<video width="854" height="480" controls="controls" autoplay="autoplay">
<source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4">
stuff
</video>
</div>
Answer by #Wayne: I believe the answer is here stackoverflow.com/a/12174154/483536 Chrome can play .mp4 with H-264 video but not MPEG-4 Visual video. and there should be a closing tag.
wrong doctype "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">"
HTML5 doctype is: <!DOCTYPE html>
add appropriate codecs as below:
<source src="MyMovie.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
Related
I want to make an mp4 video player in my HTML website.
I use this code in the body:
<html>
<head>
<title>Document></title>
<body>
<video width="400" controls>
<source src="video.mp4" type="video/mp4">
</video>
</body>
</html>
When I save it and refresh my website in the browser, there is an mp4 box but the video is not playing.
you need to pass the value muted if you are using it in chrome as mentioned here
In some browsers (e.g. Chrome 70.0) autoplay doesn't work if no muted attribute is present.
<video width="400" autoplay controls muted>
It seems you are new to html because you don't do indentation correctly and you did not close the <head> :
The right way to do it is :
<html>
<head>
<title>Document</title>
</head>
<body>
<video width="400" controls>
<source src="video.mp4" type="video/mp4" />
</video>
</body>
<html>
I think you should review your fundamentals before continuing.
I am using uihtml in matlab to play a video,I could embed a video in the uifigure,but it plays when I press the play button.
Is there a way to autoplay a video in uihtml in matlab?
my current HTML script looks like this :
<!DOCTYPE html>
<html>
<body style="background-color:black;font-family:arial;">
<video width="583" height="325" controls autoplay>
<source src="./movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</body>
</html>
Found a solution for this, 'muted' should be added with autoplay to enable autoplay in uihtml in matlab
<!DOCTYPE html>
<html>
<body style="background-color:black;font-family:arial;">
<video width="583" height="325" autoplay muted loop>
<source src="./movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</body>
</html>
Here is the code what i'm using
<!DOCTYPE html>
<html>
<body>
<video width="400" controls>
<source src="mov_bbb.mp4" type="video/mp4">
<source src="mov_bbb.ogg" type="video/ogg">
Your browser does not support HTML5 video.
</video>
<p>
Video courtesy of
Big Buck Bunny.
</p>
</body>
</html>
i'm using Mozilla browser and its version is 4.3
How come google chrome can play the following video:
http://www.w3schools.com/html/mov_bbb.mp4
But not when I try to do it myself?
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<video width="500" height="300" controls autoplay>
<source src="Videos/SampleVIDEO1.mp4" type="video/mp4">
Your browser doesn't support video, you may download the video instead: Click.
</video>
</body>
</html>
I cannot for the life of me get the audio tag to work in IE9. Here is my code, what exactly am I doing wrong? I made sure my tags were all in order and I put an exception in to force IE9 to use HTML5. Thanks in advance for your help.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CD Cover Animation</title>
<script type="text/javascript" src="js/animCD.js?rev=new"></script>
<link rel="stylesheet" href="style.css" type="text/css" />
<!-- Show Audio when button is clicked -->
<script type="text/javascript">
function showAudio()
{
document.getElementById('audioInterview').style.visibility='visible';
}
</script>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
</head>
<body>
<video autoplay="autoplay" id="videoBackground" width="1280" height="720" preload="auto" ontimeupdate="animCD_onprogress();">
<source id="colorVid_mp4" type="video/mp4" src="img/luther-2.mp4">
<source id="colorVid_ogg" type="video/ogg" src="img/luther-2.ogg">
</video>
<audio id="audioInterview" preload='auto' controls style="visibility:hidden"
<source src="audio/interview.mp3" type="audio/mp3">
Your browser does not support the audio element.
</audio>
<!-- <div class="buttonSkip" onclick="alert('Clicked Skip');"></div> -->
<p><a class="ex2" href="http://www.lrltv.org/muslims-nuclear.html">[ skip intro]</a></p>
<div id="buttonPlacement" class="buttonPlacement">
<div onclick="showAudio();" class="btnDonate"></div>
<div onclick="alert('Clicked Buy');" class="btnBuy"></div>
</div>
<!-- Add more buttons here -->
</body>
</html>
Like the comments say, you need to close the audio tag. But that they don't mean the </audio> but the > at the end of the line. It should look like this:
<audio id="audioInterview" preload="auto" controls="controls" style="visibility:hidden">
<source src="audio/interview.mp3" type="audio/mp3">
Your browser does not support the audio element.
</audio>
I also use the controls="controls".
If you don't need to show the audio control, you also do this in pure JavaScript.
var audioInterview = new Audio('audio/interview.mp3');
audioInterview.play();
And then remove the HTML audio tag.