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. HDU 3668 Volume (数学,积分)

    题意:求图中交叉圆柱体的体积! 析:大体思路很明确,把两个圆柱的体积加起来 减去中间公共部分的即可!第一步首先得想到公共部分是一个怎样的图形.这个在高数下册例题中有讲到! 中间实线部分就是第一卦限内的 ...

  2. [转]Oracle 操作字符串的函数

    转至:http://yedward.net/?id=62 (1)oracle中实现截取字符串:substr substr(string, start_position, [length]) 其中,st ...

  3. AxWindowsMediaPlayer创建、添加播放列表(C#)

    // 创见打开对话框对象实例            OpenFileDialog openFileDialog = new OpenFileDialog(); //设置为可以打开多个文件        ...

  4. java functional syntax overview

    Defining a Functional Interface @FunctionalInterface public interface TailCall<T> { TailCall&l ...

  5. 再次理解JavaScript原型链和匿名函数

    <!--------------------------------------------- 1.演示匿名加载 2.js单进程执行流 3.原型链理解 a.__proto__:属性每个对象都有 ...

  6. Nginx启动停止命令

    操作环境是Windows 一.nginx命令:启动nginx 在Windows上安装好nginx后,我们需要启动nginx服务,启动nginx服务的命令行操作主要有两种方式,即 cd D:\opens ...

  7. SQL Server活动监视器

    打开SQL Server活动监视器:

  8. iOS开发笔记系列-基础5(分类和协议)

    分类 在Objective-C中,除了通过新建子类的方式来向类添加新方法外,还可以通过分类的方式.分类提供了一种简单的方式,将类的定义模块化到相关方法的组或分类中,它还提供了扩展现有类定义的简便方式, ...

  9. Codeforces Round #Pi (Div. 2) D. One-Dimensional Battle Ships set区间分解

    D. One-Dimensional Battle ShipsTime Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/co ...

  10. Codeforces gym 100685 E. Epic Fail of a Genie 贪心

    E. Epic Fail of a GenieTime Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/gym/100685 ...