HTML5 自制本地网页视频播放器

最新推荐文章于 2024-08-24 20:56:25 发布

weixin_30674525

最新推荐文章于 2024-08-24 20:56:25 发布

阅读量900

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/dzzy/p/4681068.html

版权

HTML5初试：本地视频用网页打开啦半个广告都可以没有，看来暴风什么的快要淘汰了。

视频格式还是有要求的，看来要备一个转码器。

格式	IE	Firefox	Opera	Chrome	Safari
Ogg	No	3.5+	10.5+	5.0+	No
MPEG 4	9.0+	No	No	5.0+	3.0+
WebM	No	4.0+	10.6+	6.0+	No

 1 <!DOCTYPE html>
 2 <html> 
 3 <body> 
 4 
 5 <div style="text-align:center;">
 6   <button onclick="playPause()">播放/暂停</button> 
 7   <button onclick="makeNormal()">中</button>
 8   <button onclick="makeSmall()">小</button>
 9   <button onclick="makeBig()">大</button>
10   <br />     
11   <video id="video1" width="1000" controls="controls style="margin-top:15px;" >
12     <source src="G:\录像片段\速度与激情7 720p mp4.mp4" type="video/mp4" />
13    <!-- <source src="G:\录像片段\名侦探柯南 业火的向日葵.ogg" type="video/ogg" /> -->
14     Your browser does not support HTML5 video.
15   </video>
16 </div> 
17 
18 <script type="text/javascript">
19 var myVideo=document.getElementById("video1");
20 
21 function playPause()
22 { 
23 if (myVideo.paused) 
24   myVideo.play(); 
25 else 
26   myVideo.pause(); 
27 } 
28 
29 function makeBig()
30 { 
31 myVideo.width=1400; 
32 } 
33 
34 function makeSmall()
35 { 
36 myVideo.width=600; 
37 } 
38 
39 function makeNormal()
40 { 
41 myVideo.width=1000; 
42 } 
43 </script> 
44 
45 </body> 
46 </html>