播放视频的方法:

方法一、 使用HTML5播放

    <video src="./files/Clip_480_5sec_6mbps_h264.mp4" width="1000px" height="400px" controls="controls" loop="loop" autoplay="autoplay" poster="images/zzsm.png" style="border:1px solid red;">your browser does not support the video.</video>

poster用来设置视频的封面图,

loop是否循环播放

autoplay是否自动播放

controls是否显示控制按钮

缺点:兼容不太好
方法二:使用视频插件swfobject.js 首先下载下载所需要的文件,在demo.html中 <!--video_1部分-->
<div class="video_1" id="a1">
<!--<img src="{$web_path}images/banner1.jpg" />-->
</div>
<script type="text/JavaScript" src="js/swfobjects.js"></script>
<script type="text/javascript">
var v = new SWFObject("files/flvplayer.swf", "single", "1100", "550", "1");
v.addParam("allowfullscreen", "true"); //可以让视频撑满限定的宽度和高度*
v.addParam("wmode", "transparent"); //可以将视频设置不为最高层,其他层可以覆盖住视频*
v.addVariable('volume', '40');
v.addVariable("autostart", 'false');
v.addVariable("overstretch", "true");
v.addVariable("file", "files/11.flv");//视频路径
v.addVariable("image", "images/banner1.jpg");//设置视频封面图
v.write("a1");
</script>
<!--end of video_1部分-->

  

播放视频插件swfobject.js与Video Html5的更多相关文章

  1. 小型音乐播放器插件APlayer.js的简单使用例子

      本篇博客将会给出一个小型音乐播放器插件APlayer.js的使用例子.关于APlayer.js的具体介绍和Github地址,可以参考: https://github.com/MoePlayer/A ...

  2. 前端视频直播技术总结及video.js在h5页面中的应用

    全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12557070.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 目前有一个需求是在 ...

  3. JS限制 获取动太ID,播放视频

    JS限制textarea字数 function textdown(e) {textevent = e ; ) { return; } ) { alert("大侠,我手机屏幕小,先输入这么多字 ...

  4. Android VideoView播放视频

    今天介绍一下Android的视频播放控件VideoView,下面介绍一下VideoView的使用步骤: 1.在界面布局中定义VideoView组件,或者在程序中创建VideoView组件. 2.调用V ...

  5. HTML5 video标签播放视频下载原理

    HTML5 video https://github.com/remy/html5demos/blob/master/demos/video.html <video preload=" ...

  6. HTML5 - 使用<video>播放视频

    ,下面是一个播放视频的最简单样例 (controls属性告诉浏览器要有基本播放控件) <video src="hangge.mp4" controls></vid ...

  7. html5 video标签屏蔽右键视频另存为的js代码-HTML5教程

    点评:html5 video标签本身有下载功能但是在video区域内,点击右键可以将“视频另存为”下面是屏蔽右键视频另存为的js代码,有此需求的朋友不要错过   做HTML5的video标签,本身我们 ...

  8. 在使用html5的video标签播放视频时为何只有声音却没有图像

    在使用html5的video标签播放视频时为何只有声音却没有图像? 答:使用格式化工厂转个编码就行了,MP4有3种编码,mpg4(xdiv),,mpg4(xvid),avc(h264)转换成H264编 ...

  9. 【vue】使用 Video.js 播放视频

    目录 安装 引入 使用 参考文档 环境: vue 2.0+ element ui (这里的代码用了elmentui的按钮样式,可以不用elment ui的样式) 安装 在项目中安装 video.js. ...

随机推荐

  1. Java练习——抽象类

    需求: 2辆宝马,1辆别克商务舱,1辆金龙(34)座,租5天共多少租金.   轿车 客车(金杯.金龙) 车型 别克商务舱GL8 宝马550i 别克林荫大道 <=16座 >16座 日租费(元 ...

  2. python学习之常用数据结构

    前言:数据结构不管在哪门编程语言之中都是非常重要的,因为学校的课程学习到了python,所以今天来聊聊关于python的数据结构使用. 一.列表 list 1.列表基本介绍 列表中的每个元素都可变的, ...

  3. 《吃透MQ系列》核心基础全在这里了

    这是<吃透XXX>技术系列的开篇,这个系列的思路是:先找到每个技术栈最本质的东西,然后以此为出发点,逐渐延伸出其他核心知识.所以,整个系列侧重于思考力的训练,不仅仅是讲清楚 What,而是 ...

  4. POJ-3159(差分约束+Dijikstra算法+Vector优化+向前星优化+java快速输入输出)

    Candies POJ-3159 这里是图论的一个应用,也就是差分约束.通过差分约束变换出一个图,再使用Dijikstra算法的链表优化形式而不是vector形式(否则超时). #include< ...

  5. 关于《Android编程权威指南》的MockWalker在模拟器中无法运行的解决方法

    1.打开模拟器中的Dev Settings应用. 2.选中Allow mock locations选项. 之后应该就能正常运行了.

  6. pytorch(06)autograd与逻辑回归

    autograd与逻辑回归 自动求导系统中两个常用的方法: torch.autograd.backward and torch.autograd.grad 演示理解一阶导数.二阶导数的求导过程 理解自 ...

  7. .net Core 上传文件详解

    .net core 和.net framework上传文件有很多需要注意的地方 .net framework 上传文件用httppostedfilebase .net core 上传文件用 IForm ...

  8. WDN302国产化网络存储控制模块

    WDN302是一款网络存储控制模块,实现对NAS和IP-SAN的混合支持,通过以太网对海量存储的访问,实现数据的存储.共享.恢复和防丢失. 飞腾 FT1500A/16处理器,主频 1.5GHz: 支持 ...

  9. P2188 小Z的 k 紧凑数 题解(数位DP)

    题目链接 小Z的 k 紧凑数 解题思路 数位DP,把每一个数位的每一个数对应的可能性表示出来,然后求\(num(1,r)-num(1,l-1)\),其中\(num(i,j)\)表示\([i,j]\)区 ...

  10. C#上机实验(三)

    源码如下: using System; using System.Collections.Generic; using System.Linq; using System.Text; namespac ...