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(视频播放)的更多相关文章

  1. 移动端HTML5<video>视频播放优化实践

    遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...

  2. HTML5 <video> - 使用 DOM 进行控制

    HTML5 <video> 元素同样拥有方法.属性和事件. 其中的方法用于播放.暂停以及加载等.其中的属性(比如时长.音量等)可以被读取或设置.其中的 DOM 事件能够通知您,比方说,&l ...

  3. 移动端HTML5<video>视频播放优化实践[转]

    http://blog.csdn.net/u010918416/article/details/52705732 http://www.xuanfengge.com/html5-video-play. ...

  4. Chrome/Chromium HTML5 video 视频播放硬件加速

    Chromium站点上有个大致的框图.描写叙述了Chromium的video在各个平台 - 包含Android - 上是怎样使用硬件资源来做视频编解码加速的: 而依据Android Kitkat上的C ...

  5. HW Video Acceleration in Chrome/Chromium HTML5 video 视频播放硬件加速

    Introduction Video decode (e.g. YouTube playback) and encode (e.g. video chat applications) are some ...

  6. 移动端 HTML5 <video> 视频播放优化实践

    遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...

  7. [转]移动端HTML5<video>视频播放优化实践

    遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...

  8. 【HTML5】Video + DOM

    效果图: <!DOCTYPE html> <html> <body> <div style="text-align:center;"> ...

  9. Web视频播放 之 【HTML5 Video标签】

    一.说明 HTML5中引入了video标签用于方便的在浏览器中播放视频,不在需要对flashPlayer进行依赖,更加轻量级.但在浏览器兼容.视频协议支持方面还有一些需要注意的问题. 二.浏览器兼容 ...

  10. Html5 Video 实现方案

    来源:http://ask.dcloud.net.cn/article/569 源码下载 前言: 最近项目中需要用到html5 视频播放功能,于是稍微研究了解了下,遇到了很多坑,特此记录下. 一. H ...

随机推荐

  1. NGUI学习笔记(五):缓动

    在Unity3D中可以使用自带的Animation制作任意形式的动画,不过我们这篇笔记主要是学习和使用NGUI提供的Tween动画.NGUI提供的Tween库功能较为简单,主要是用来实现NGUI自身需 ...

  2. c++地址对齐

    在一些计算机上,由于性能方面的原因,2个字节的变量,必须放在2的倍数的地址中,4个字节的,就必须放在4的倍数中的地址中,以此类推. 也就是说,如果有3个占用两个字节的变量,分别为:A,B,C,如下图: ...

  3. 小学生玩ACM----广搜

    Oil Deposits Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Tot ...

  4. 配置 dovecat 的 PAM

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...

  5. Git Cmd

    http://my.oschina.net/sunboy2050/blog/55749

  6. Codeforces GYM 100114 C. Sequence 打表

    C. Sequence Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/gym/100114 Description ...

  7. key 限制字符的输入

    //限制字符的输入 { 只能输入以下字符 } procedure TForm1.Edit1KeyPress(Sender: TObject; var Key: Char);begin  If (Key ...

  8. 搭建Nginx图片服务器

    搭建Nginx图片服务器 Part-I 安装Nginx 安装PCRE 下载 ngx_cache_purge 并解压,用来清除缓存 下载Nginx并解压 cd nginx-1.7.7 编译,--pref ...

  9. 用CSV文件读写数据的两种方式(转)

    导读:有时候我们需要对收集的数据做统计,并在页面提供显示以及下载.除了对传统的excel存取之外,对CSV文件的存取也很重要.本文列出了这两种操作的详细代码. 代码: <?php $file = ...

  10. centos x86_64--------------------------------系统调用

    http://blog.csdn.net/hmsiwtv/article/details/11022241 [root@monitor ~]# cat /usr/include/asm/unistd. ...