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

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>
时间: 2024-10-14 12:38:45

HTML5 自制本地网页视频播放器的相关文章

仿照网易云音乐项目(自制音乐网页播放器)

最近准备把上一周做的一个仿网易云音乐的自制音乐网页播放器项目做一个总结. 相关功能如下: 1.通过后台页面上传歌曲.编辑歌曲功能.    2.前端页面自动更新播放热度高的歌曲    3.在线听歌.查看歌词.且配有相应的播放动画. 原文地址:https://www.cnblogs.com/gitnull/p/10041183.html

flowplayer网页视频播放器事例详解--包含各种参数说明(自译)

flowplayer网页视频播放器事例详解--包含各种参数说明(自译) <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server">     <title></title>     <meta http-equiv="content-type" content="text/html; charset=UTF-8&

ckplayer-超酷网页视频播放器的使用

现在网上做视频播放的很多,我就用过ckplayer这一款,虽然不知道别的播放器怎么样,但ckplayer还是比较不错的.调用简单.说明清晰.可扩展性很强,我老喜欢了. 当然引用人家的东西一定得去人家的官网上看看,因为官网上才正规的帮助手册,案例展示,详细的配置方法.看过了配置说明,一般大家都能整合到自己的网站上. 这就是ckplayer网页播放器的官网地址:http://www.ckplayer.com/ 一开始我是觉得ckplayer能免费修改自己的logo,并且皮肤也很好看,看了下调用的方法

网页视频播放器插件源码

1.ckplayer插件视频播放器 2.Flash插件播放器 <object type="application/x-shockwave-flash" data="video/vcastr3.swf" width="800" height="454" id="vcastr3"> <param name="movie" value="video/vcastr3.

网页视频播放器代码大全 + 21个为您的站点和博客提供的免费视频播放器

推荐 使用 极酷 Web在线播放器. 网页中嵌入视频代码综合全然版 1.avi格式 代码片断例如以下: 程序代码 <objectid="video"width="400"height="200"border="0"classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"> <paramname="ShowDisplay"v

Bootstrap+Html5制作强大的网页视频播放器

在做视频管理系统时,我们的定位是做到类似土豆视频的功能.视频管理,当然播放是必不可少的.在做这个播 放页面的时候,也研究了一下土豆的播放器,土豆用的是自己做的.但由于我们目前的技术有限,于是想着从网上找 一个现成的插件,于是开始了播放器的技术选型. 我发现了一个好的插件叫Video.js,研究了一下.基本的播放没问题,但当需要动态传参播放视频的时候,该款 播放器却很难跟着我的思路走,参数动态传不进去.如果现在去研究内部的js,改动内部代码,时间不允许.于是迫 不得已,只能另换解决方案. 搜索一番

网页视频播放器

以前公司项目用到大量的视频,慢慢找到一个可以自定义比较好的视频播放插件

网页视频播放器可兼容IE8

插件 flowplayer-3.2.13.min.js HTML代码 <div id="video"></div> JS代码调用 flowplayer("video", "script/flowplay/flowplayer-3.2.18.swf", { clip: { url: "image/video/Coolpad.mp4", autoPlay: false, autoBuffering: tru

网页视频播放器/视频播放插件

支持的音视频格式: .swf..wmv..asf..wma..mp3..asx..mid..midi..rm..ra..rmvb..mp4..mov..avi..wav..ram..mpg..mpeg.flv; 下载地址 下载:站长下载  Admin5下载 使用方法: 步骤1:网站中引用video.js文件(src路径根据网站实际情况自行修改) <script src="video.js" type="text/javascript"></scri