初探html5---Video + DOM(视频播放)
1:HTML5 开发环境下 lang="en"
2:
<video width="320" height="240" controls="controls"> 其中 controls="controls" controls 属性供添加播放、暂停和音量控件。
<div style="text-align:center">
<button onclick="bigen()">播放/暂停</button>
<button onclick="big()">大</button>
<button onclick="centre()">中</button>
<button onclick="small()">小</button>
</br>
<video id="video1" width="420" style="margin-top;15px;" controls="controls">
<source src="mp4/mov_bbb.mp4" type="video/mp4"/>
<source scr="mp4/mov_bbb.mp4" type="video/ogg">
</video>
</div>
<script type="text/javascript">
var myone1=document.getElementById("video1");
function bigen()
{
if(myone1.paused)
myone1.play();
else
myone1.pause();
}
function big()
{
myone1.width=560;
}
function centre()
{
myone1.width=420;
}
function small()
{
myone1.width=320;
}
</script>
初探html5---Video + DOM(视频播放)的更多相关文章
- 移动端HTML5<video>视频播放优化实践
遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...
- HTML5 <video> - 使用 DOM 进行控制
HTML5 <video> 元素同样拥有方法.属性和事件. 其中的方法用于播放.暂停以及加载等.其中的属性(比如时长.音量等)可以被读取或设置.其中的 DOM 事件能够通知您,比方说,&l ...
- 移动端HTML5<video>视频播放优化实践[转]
http://blog.csdn.net/u010918416/article/details/52705732 http://www.xuanfengge.com/html5-video-play. ...
- Chrome/Chromium HTML5 video 视频播放硬件加速
Chromium站点上有个大致的框图.描写叙述了Chromium的video在各个平台 - 包含Android - 上是怎样使用硬件资源来做视频编解码加速的: 而依据Android Kitkat上的C ...
- HW Video Acceleration in Chrome/Chromium HTML5 video 视频播放硬件加速
Introduction Video decode (e.g. YouTube playback) and encode (e.g. video chat applications) are some ...
- 移动端 HTML5 <video> 视频播放优化实践
遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...
- [转]移动端HTML5<video>视频播放优化实践
遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...
- 【HTML5】Video + DOM
效果图: <!DOCTYPE html> <html> <body> <div style="text-align:center;"> ...
- Web视频播放 之 【HTML5 Video标签】
一.说明 HTML5中引入了video标签用于方便的在浏览器中播放视频,不在需要对flashPlayer进行依赖,更加轻量级.但在浏览器兼容.视频协议支持方面还有一些需要注意的问题. 二.浏览器兼容 ...
- Html5 Video 实现方案
来源:http://ask.dcloud.net.cn/article/569 源码下载 前言: 最近项目中需要用到html5 视频播放功能,于是稍微研究了解了下,遇到了很多坑,特此记录下. 一. H ...
随机推荐
- Java NIO类库Selector机制解析(上)
一. 前言 自从J2SE 1.4版本以来,JDK发布了全新的I/O类库,简称NIO,其不但引入了全新的高效的I/O机制,同时,也引入了多路复用的异步模式.NIO的包中主要包含了这样几种抽象数据类型: ...
- PHP实现基于Swoole简单的HTTP服务器
引用Swoole官方定义: PHP语言的异步.并行.高性能网络通信框架,使用纯C语言编写,提供了PHP语言的异步多线程服务器,异步TCP/UDP网络客户端,异步MySQL,数据库连接池,AsyncTa ...
- DotNetZip封装类
DotnetZip是一个开源类库,支持.NET的任何语言,可很方便的创建,读取,和更新zip文件.而且还可以使用在.NETCompact Framework中. 下载地址在这里: http://d ...
- TinyTask Portable(录制和回放电脑操作过程)
一直想找个软件,可以回放自己或他人编码的过程.我认为,只有亲眼看到别人是怎么做的,才能更好的了解他人的思路. 虽然找到http://thecodeplayer.com/这个,但它只能回放它上面的代码, ...
- MATLAB remove outliers.
Answer by Richard Willey on 9 Jan 2012 Hi Michael MATLAB doesn't provide a specific function to remo ...
- C#中反射的使用(How to use reflect in CSharp)(2)
在上一篇里,我们叨逼了好多如何获取到程序集里的对象,但是对象有了,还不知道怎么调,OK,下面开始干这个对象: 首先,我们对上一篇的对象做了一些修改,以适应多种情况: using System; usi ...
- bash学习之变量的显示和设置
显示变量:echo $MAIL或者 echo ${MAIL} [CJP@CJP ~]$ echo $MAIL /var/spool/mail/CJP [CJP@CJP ~]$ echo ${MAIL} ...
- Converting a .jks Key Store to a .pem Key Store
In order to convert a Java key store into a Privacy Enhanced Mail Certificate, you will need to use ...
- win7常用快捷键
Win+1:打开/显示超级任务栏第一个图标代表的程序Win+2:打开/显示超级任务栏第二个图标代表的程序(3.4.……如此类推)Win+Tab:3D切换窗口,你要是按住不松口,则所有窗口会轮流翻转Wi ...
- SqlServer更新视图存储过程函数脚本
--视图.存储过程.函数名称 DECLARE @NAME NVARCHAR(255); --局部游标 DECLARE @CUR CURSOR --自动修改未上状态为旷课 SET @CUR=CURSOR ...