播放视频插件swfobject.js与Video Html5
播放视频的方法:
方法一、 使用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的更多相关文章
- 小型音乐播放器插件APlayer.js的简单使用例子
本篇博客将会给出一个小型音乐播放器插件APlayer.js的使用例子.关于APlayer.js的具体介绍和Github地址,可以参考: https://github.com/MoePlayer/A ...
- 前端视频直播技术总结及video.js在h5页面中的应用
全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12557070.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 目前有一个需求是在 ...
- JS限制 获取动太ID,播放视频
JS限制textarea字数 function textdown(e) {textevent = e ; ) { return; } ) { alert("大侠,我手机屏幕小,先输入这么多字 ...
- Android VideoView播放视频
今天介绍一下Android的视频播放控件VideoView,下面介绍一下VideoView的使用步骤: 1.在界面布局中定义VideoView组件,或者在程序中创建VideoView组件. 2.调用V ...
- HTML5 video标签播放视频下载原理
HTML5 video https://github.com/remy/html5demos/blob/master/demos/video.html <video preload=" ...
- HTML5 - 使用<video>播放视频
,下面是一个播放视频的最简单样例 (controls属性告诉浏览器要有基本播放控件) <video src="hangge.mp4" controls></vid ...
- html5 video标签屏蔽右键视频另存为的js代码-HTML5教程
点评:html5 video标签本身有下载功能但是在video区域内,点击右键可以将“视频另存为”下面是屏蔽右键视频另存为的js代码,有此需求的朋友不要错过 做HTML5的video标签,本身我们 ...
- 在使用html5的video标签播放视频时为何只有声音却没有图像
在使用html5的video标签播放视频时为何只有声音却没有图像? 答:使用格式化工厂转个编码就行了,MP4有3种编码,mpg4(xdiv),,mpg4(xvid),avc(h264)转换成H264编 ...
- 【vue】使用 Video.js 播放视频
目录 安装 引入 使用 参考文档 环境: vue 2.0+ element ui (这里的代码用了elmentui的按钮样式,可以不用elment ui的样式) 安装 在项目中安装 video.js. ...
随机推荐
- win10使用cmd命令关闭防火墙
在搜索框内输入cmd,右键选择管理员运行 然后输入: NetSh Advfirewall set allprofiles state off #关闭防火墙 Netsh Advfirewall show ...
- 干货满满-原来这才是hooks-React Hooks使用心得
序言 ---最后有招聘信息哦-React是一个库,它不是一个框架.用于构建用户界面的Javascript库.这里大家需要认识这一点.react的核心在于它仅仅是考虑了如何将dom节点更快更好更合适的渲 ...
- C语言之三字棋的简单实现及扩展
C语言之三字棋的简单实现及扩展 在我们学习完数组之后,我们完全可以利用数组相关知识来写一个微小型的游戏,比如说今天所说的--三子棋. 大纲: 文件组成 实现 完整代码展示 扩展 即: 一.文件 ...
- vue 折线柱状图
需求:折线柱状图实现,显示不同提示,颜色,标记等等. 图例: 实现: <template> <div class="transaction-barline"> ...
- Flutter 改善套娃地狱问题(仿喜马拉雅PC页面举例)
前言 这篇文章是我一直以来很想写的一篇文章,终于下定决心动笔了. 写Flutter的小伙伴可能都感受到了:掘金的一些热门的Flutter文章下,知乎的一些Flutter的话题下或者一些论坛里面,喷Fl ...
- ASP.NET跨域访问解决
第一种: step1:添加引用(搜索CORS) step2: App_Start/WebApiConfig.cs中添加配置 step3: 在控制器中添加特性 第二种: 在App_Start/WebAp ...
- 7、Spring教程之使用注解开发
1.说明 在spring4之后,想要使用注解形式,必须得要引入aop的包 <dependency> <groupId>org.springframework</group ...
- 【PHP】用了这么久的Laravel框架,你分析过核心架构了没
Laravel最初的设计是为了面向MVC架构的,它可以满足如事件处理.用户身份验证等各种需求.另外它还有一个由管理数据库强力支持,用于管理模块化和可扩展性代码的软件包管理器. Laravel以其简洁. ...
- (二)Struts2配置文件
一.web.xml文件 web.xml配置文件是一种J2EE配置文件,决定servlet容器的HTTP元素需求如何进行处理.它严格来说不是一个Struts2 配置文件,但它是Struts2 运作所需要 ...
- docker之镜像配置
以管理员sudo执行以下命令 docker ps -a 查看镜像的id docker exec -it 镜像id /bin/bash -i表示交互模式 -t表示启动容器进入命令行 加入这两参数,容器创 ...