Video tags define videos, such as movie clips or other video streams. Currently the video tag only supports videos in mp4,webmail,ogg format.
Compatibility: IE8 and earlier versions do not support video tags. Other modern browsers are supported.
Each browser supports the following for each video format:
- MP4 = MPEG 4 files using H264 Video codec and AAC audio codec
- WebM = WebM file uses VP8 video codec and Vorbis audio codec
- OGG = Ogg file using Theora Video codec and Vorbis audio codec
The properties of the tag and the meaning of each value
<video id= "My-video" class= "Movie-video" Span class= "Hl-code" > width= " 320 " height= "240" controls preload= "Auto" poster= "Img/adpic/video.png ( Design said video cover) ">
< Span class= "hl-quotes" > < Span class= "hl-brackets" > <source< Span class= "Hl-code" > src= " movie.mp4 " type= "video/mp4" >
< Span class= "hl-quotes" > < Span class= "hl-brackets" > <source< Span class= "Hl-code" > src= " movie.ogg " type= "video/ogg" >
< Span class= "hl-quotes" > < Span class= "hl-brackets" > < Span class= "hl-quotes" > Your browser does not support the video tag.
< Span class= "Hl-code" > < Span class= "Hl-code" > </video >
$ (document). On (' Tap ', '. Movie-video ', vidplay);
function Vidplay () {
var video = document.getElementById ("My-video");
if (video.paused) {
Video.play ();
} else {
Video.pause ();
$ ('. Movie-video '). attr ("Contols", "controls");
}
}
# #在这次做需求的时候遇见了视频播放只有声音没有画面的情况. The final location is the video format problem, did not export when the code is not selected as H264.
* * Video files are generally larger. And the network bandwidth is limited, so need video files without affecting the picture quality as small as possible. There is a small trick that can make video files smaller without compromising picture quality. I first convert the source file to AVI, so that the size will be automatically compressed, that is, from 800m to 200m and then back to MP4 at this time to choose the code for H264 last out only more than 100 m. So you get a small video of the desired format ~
# #做的页面在h5的浏览器中运行的好好的. Only the exception is played in the iOS9. The original is iOS9 for the network protocol HTTP requirements are more stringent. Before the iOS8 and after the iOS10 all to this request release. Therefore, you only need to change the network protocol to HTTPS. The Play page page on iOS9 is OK.
Video tags play videos only sound without screen & video tag play in iOS9 is not valid