Video事件、方法-- DOM
<video> 元素同样拥有方法、属性和事件。
其中的方法用于播放、暂停以及加载等。其中的属性(比如时长、音量等)可以被读取或设置。其中的 DOM 事件能够通知您,比方说,<video> 元素开始播放、已暂停,已停止,等等。
下例中简单的方法,向我们演示了如何使用 <video> 元素,读取并设置属性,以及如何调用方法。
实例
为视频创建简单的播放/暂停以及调整尺寸控件:
<div style="text-align:center;">
<button onclick="playPause()">播放/暂停</button>
<button onclick="makeBig()">大</button>
<button onclick="makeNormal()">中</button>
<button onclick="makeSmall()">小</button>
<br />
<video id="video1" width="420" style="margin-top:15px;">
<source src="/example/html5/mov_bbb.mp4" type="video/mp4" />
<source src="/example/html5/mov_bbb.ogg" type="video/ogg" />
Your browser does not support HTML5 video.
</video>
</div> <script type="text/javascript">
var myVideo=document.getElementById("video1"); function playPause()
{
if (myVideo.paused)
myVideo.play();
else
myVideo.pause();
} function makeBig()
{
myVideo.width=560;
} function makeSmall()
{
myVideo.width=320;
} function makeNormal()
{
myVideo.width=420;
}
</script>
Video事件、方法-- DOM的更多相关文章
- jQuery 事件方法
事件方法触发器或添加一个函数到被选元素的事件处理程序. 下面的表格列出了所有用于处理事件的 jQuery 方法. 方法 描述 bind() 向匹配元素附加一个或更多事件处理器 blur() 触发.或将 ...
- JQuery(选择器、事件、DOM操作)
一.jQuery简介 jQuery 是一个 JavaScript 库. jQuery 极大地简化了 JavaScript 编程. jQuery 库位于一个 JavaScript 文件中,其中包含了所有 ...
- js事件对象--DOM中的事件对象/IE中的事件对象/跨浏览器的事件对象
事件对象 在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息.包括导致事件的元素.事件的类型,以及其他与特定事件相关的信息.例如,鼠标操作导致的事件对 ...
- jQuery 事件 方法
jQuery 事件方法 事件方法触发器或添加一个函数到被选元素的事件处理程序. 下面的表格列出了所有用于处理事件的 jQuery 方法. 方法 描述 bind() 向元素添加事件处理程序 blur() ...
- 5事件DOM零级事件跟DOM二级事件
事件的行为传播,行为本身跟事件绑定没有关系:1.全新认识事件(某一个具体的行为)->行为本身:浏览器天生自带的一些行为操作->click,mouseover(mouseenter),mou ...
- js自定义事件、DOM/伪DOM自定义事件
一.说明.引言 我JS还是比较薄弱的,本文的内容属于边学边想边折腾的碎碎念,可能没什么条理,可能有表述不准确的地方,可能内容比较拗口生僻.如果您时间紧迫,或者JS造诣已深,至此您就可以点击右侧广告(木 ...
- jQuery入门基础(事件、DOM操作)
http://www.w3school.com.cn/b.asp 一.事件 1.常规事件——把js事件前面的on去掉 比如:js:onclick——JQuery:click 下面是 jQuery 中事 ...
- Jq_DOM元素方法跟JQuery 核心函数跟JQuery 事件方法
JQuery DOM 元素 函数 描述 .get() 从队列中删除所有未运行的项目. .ind ...
- jQuery绑定事件方法及区别(bind,click,on,live,one)
第一种方式: ? 1 2 3 4 5 $(document).ready(function(){ $("#clickme").click(function(){ alert(& ...
- 整理之DOM事件阶段、冒泡与捕获、事件委托、ie事件和dom模型事件、鼠标事件
整理之DOM事件阶段 本文主要解决的问题: 事件流 DOM事件流的三个阶段 先理解流的概念 在现今的JavaScript中随处可见.比如说React中的单向数据流,Node中的流,又或是今天本文所讲的 ...
随机推荐
- jquery 提示插件 cluetip
jquery的 插件cluetip, 地址下载是:plugins.learningjquery.com/cluetip/demo/ 下面简单讲解下用法: 1 首先当然要放JQUERY的基本JS,和这个 ...
- Yii处理流程
Yii的应用程序处理流程 用户访问URL http://www.example.com/blog/index.php?r=site/contact 1.入口脚本被网站服务器执行以处理此请求. 2.一个 ...
- div居中鼠标悬浮显示下拉列表
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 尚未在 Web 服务器上注册 ASP.NET 4.0” 的解决办法
http://www.sowsoy.com/topics-537.html win7,vs2010创建.NetFramework 4框架下的Asp.Net空网站.系统提示 “尚未在 Web 服务器上注 ...
- 【session】
users.json { "tobi": { "password": "ferret", "name": "T ...
- SourceTree + Bitbucket - 轻松云端作业
如何新建bitbucket工程 常见流程: 1: 本地电脑 A:创建Xcode工程 2:Bitbucket网站 A:"创建"仓库 B:然后"从零开始",根据提示 ...
- (转载)Javascript操作表单之间的数据传递
(转载)http://www.aspxhome.com/javascript/skills/200710/214825.htm 今天有朋友问我关于用JAVASCRIPT来进行页面各表单之间的数据传递的 ...
- (转载)更好的重启nginx 服务器
(转载)http://jar-c.blog.163.com/blog/static/1164012502010511128782/ 以前使用的重启命令 killall -HUP nginx 停止ki ...
- git 和 github 使用笔记
想干这么一件事:写一个web自动化测试的项目,部署在公司内网的小服务器上. 我想拐个弯干这件事:公司有一个工作用的windows电脑,还有一个linux Ubuntu11.04的小测试服务器.我在本地 ...
- Linux下Java环境变量设置
我用的是oh my zsh,需要修改.zshrc,记一下免得以后忘记在哪儿改的. 如果你用的是自带的terminal那么用文本编辑器打开用户目录下的.bash_profile文件 在.bash_pro ...