- 浏览: 303792 次
- 性别:
- 来自: 上海
文章分类
- 全部博客 (243)
- Core Java (13)
- Java (12)
- Android (2)
- Lucene (3)
- J2EE (3)
- Hibernate (2)
- Jsp & Servlet (3)
- Struts2 (3)
- Spring (5)
- JSF (6)
- RichFaces (2)
- HTML & JS & DOM & CSS (87)
- browser (1)
- Ajax & A4J (2)
- Workflow (1)
- Maven (3)
- Linux (2)
- VM & VBOX (1)
- Tomcat (1)
- Cache (3)
- Others (36)
- design (1)
- PHP (1)
- Try.js (1)
- HTML5 && CSS3 && ECMAScript5 (26)
- 疯言疯语 (5)
- mongodb (2)
- Hardware Common Sence (1)
- RESTful (3)
- Nginx (2)
- web安全 (8)
- Page Design (1)
- web performance (1)
- nodejs (4)
- python (1)
最新评论
-
New_Mao_Er:
求最新的版本破解啊!!!
Omondo eclipseUML插件破解 -
konglx:
讲得仔细,谢了
全面分析 Spring 的编程式事务管理及声明式事务管理 -
cilendeng:
对所有post有效只能使用过滤器
说说Tomcat的Server.xml的URIEncoding=‘UTF-8’配置 -
jiulingchen:
mark了,灰常感谢!
JAVA中最方便的Unicode转换方法 -
anlaetion:
这算法可以有
js 字符串搜索算法
<audio> 标签属性:
- src:音乐的URL
- preload:预加载
- autoplay:自动播放
- loop:循环播放
- controls:浏览器自带的控制条
<audio id="media" src="http://www.abc.com/test.mp3" controls></audio>
<video> 标签属性:
- src:视频的URL
- poster:视频封面,没有播放时显示的图片
- preload:预加载
- autoplay:自动播放
- loop:循环播放
- controls:浏览器自带的控制条
- width:视频宽度
- height:视频高度
<video id="media" src="http://www.abc.com/test.mp4" controls width="400px" heigt="400px"></video>
获取HTMLVideoElement和HTMLAudioElement对象
//audio可以直接通过new创建对象 Media = new Audio("http://www.abc.com/test.mp3"); //audio和video都可以通过标签获取对象 Media = document.getElementById("media");
Media方法和属性:
HTMLVideoElement 和 HTMLAudioElement 均继承自 HTMLMediaElement
//错误状态 Media.error; //null:正常 Media.error.code; //1.用户终止 2.网络错误 3.解码错误 4.URL无效 //网络状态 Media.currentSrc; //返回当前资源的URL Media.src = value; //返回或设置当前资源的URL Media.canPlayType(type); //是否能播放某种格式的资源 Media.networkState; //0.此元素未初始化 1.正常但没有使用网络 2.正在下载数据 3.没有找到资源 Media.load(); //重新加载src指定的资源 Media.buffered; //返回已缓冲区域,TimeRanges Media.preload; //none:不预载 metadata:预载资源信息 auto: //准备状态 Media.readyState; //1:HAVE_NOTHING 2:HAVE_METADATA 3.HAVE_CURRENT_DATA 4.HAVE_FUTURE_DATA 5.HAVE_ENOUGH_DATA Media.seeking; //是否正在seeking //回放状态 Media.currentTime = value; //当前播放的位置,赋值可改变位置 Media.startTime; //一般为0,如果为流媒体或者不从0开始的资源,则不为0 Media.duration; //当前资源长度 流返回无限 Media.paused; //是否暂停 Media.defaultPlaybackRate = value;//默认的回放速度,可以设置 Media.playbackRate = value;//当前播放速度,设置后马上改变 Media.played; //返回已经播放的区域,TimeRanges,关于此对象见下文 Media.seekable; //返回可以seek的区域 TimeRanges Media.ended; //是否结束 Media.autoPlay; //是否自动播放 Media.loop; //是否循环播放 Media.play(); //播放 Media.pause(); //暂停 //控制 Media.controls;//是否有默认控制条 Media.volume = value; //音量 Media.muted = value; //静音 //TimeRanges(区域)对象 TimeRanges.length; //区域段数 TimeRanges.start(index) //第index段区域的开始位置 TimeRanges.end(index) //第index段区域的结束位置
事件:
eventTester = function(e){ Media.addEventListener(e,function(){ console.log((new Date()).getTime(),e); }); } eventTester("loadstart"); //客户端开始请求数据 eventTester("progress"); //客户端正在请求数据 eventTester("suspend"); //延迟下载 eventTester("abort"); //客户端主动终止下载(不是因为错误引起), eventTester("error"); //请求数据时遇到错误 eventTester("stalled"); //网速失速 eventTester("play"); //play()和autoplay开始播放时触发 eventTester("pause"); //pause()触发 eventTester("loadedmetadata"); //成功获取资源长度 eventTester("loadeddata"); // eventTester("waiting"); //等待数据,并非错误 eventTester("playing"); //开始回放 eventTester("canplay"); //可以播放,但中途可能因为加载而暂停 eventTester("canplaythrough"); //可以播放,歌曲全部加载完毕 eventTester("seeking"); //寻找中 eventTester("seeked"); //寻找完毕 eventTester("timeupdate"); //播放时间改变 eventTester("ended"); //播放结束 eventTester("ratechange"); //播放速率改变 eventTester("durationchange"); //资源长度改变 eventTester("volumechange"); //音量改变[转自:http://directguo.com/blog/index.php/2010/07/html5-audio-video-tag/]
发表评论
-
发布`代码生成器`
2014-11-17 00:45 548闲话不说,直接上地址 npm: https://www. ... -
IE7及以下浏览器应该可以不再提供支持了吧
2014-08-24 09:38 408IE7及以下浏览器应该可以不再提供支持了吧,毕竟现在win ... -
__defineSetter__、__defineGetter__、__lookupSetter__、__lookupGetter__
2014-07-10 17:16 774var t = { //主要是要注意这里的 ... -
JS、CSS以及img对DOMContentLoaded事件的影响
2014-07-10 10:57 483前端的纯技术就是对规范的认知 什么是DOMContentL ... -
再说说seaj
2014-07-01 00:05 322记录刚刚在企鹅群里关于seajs的require和requi ... -
font-size : Rem
2014-06-29 10:04 472CSS3的出现,他同时引进了一些新的单位,包括我们今天所说 ... -
XSS 前端防火墙 —— 整装待发
2014-06-24 08:02 436到目前为止,我们把 ... -
XSS 前端防火墙 —— 天衣无缝的防护
2014-06-24 08:01 350上一篇讲解了钩子程序的攻防实战,并实现了一套对框架页的监控 ... -
XSS 前端防火墙 —— 无懈可击的钩子
2014-06-24 08:00 478昨天尝试了一系列的可疑模块拦截试验,尽管最终的方案还存在着 ... -
XSS 前端防火墙 —— 无懈可击的钩子
2014-06-21 18:04 0<div class="iteye-blog- ... -
XSS 前端防火墙 —— 可疑模块拦截
2014-06-21 17:02 588上一篇介绍的系统,虽然能防御简单的内联 XSS 代码,但想绕 ... -
XSS 前端防火墙 —— 内联事件拦截
2014-06-21 16:55 524关于 XSS 怎样形成、如何注入、能做什么、如何防范,前人 ... -
浅谈XSS(二)
2014-06-21 16:48 471前面我们说到了反射性XSS的发掘,里面涉及了很多javas ... -
谈论XSS(一)
2014-06-21 16:41 490XSS 叫跨站脚本攻击(Cross Site Script ... -
Web安全漏洞简介之XSS
2014-06-21 16:30 777随着互联网流行,以及网站互动性的提高,像论坛、微博还有各种 ... -
正则再了解——test方法
2014-06-19 09:16 525不经意发现正则的test方法也会产生捕获结果。 /(\w ... -
js内存管理
2014-06-05 00:56 428简介 低级语言,比如 ... -
js中如何封装模块
2014-06-03 12:44 363统一模块定义: function UMD(name ... -
再说prototype
2014-05-23 13:29 380直接看代码吧: //写法一 function A(){} ... -
for... in遍历的顺序
2014-05-14 11:40 657虽然ECMAScript规定了对 ...
相关推荐
HTML5 AudioVideo 标签,属性,方法,事件
This profile defines the requirements for Bluetooth™ devices necessary for the support of the Audio/Video Remote Control usage case. The requirements are expressed in terms of end-user services, and ...
HTML5新增加的audio和video标签让我们增加了很多惊喜,可以让我们更方便的在网页中播放音频和视频。但目前很多浏览器不支持,无法在旧版的IE浏览器中使用。html5media.min.js却是一个能让这两个标签在各种新旧版IE...
RTP: Audio and Video for the Internet By Colin Perkins Publisher : Addison Wesley Pub Date : June 12, 2003 ISBN : 0-672-32249-8 Pages : 432 The Real-time Transport Protocol (RTP) provides ...
浏览器HTML5标签video和audio支持 包含其相应支持的格式
If you embed audio or video in your website, you should use HTML5.
A&EM Alarm & Event Management 告警与事件管理 A&VE Audio / Video Editor 音频/视频编辑器 A-A Analog-Analog 模模 A-D Analog-Digital 模数 A/D Analog / Digital 模拟/数字 A/V Audio / Video 音频/视频 A...
html5 audio demo【修复拖动进度条bug】 html5 audio demo【修复拖动进度条bug
A jQuery plugin, jPlayer allows you to rapidly weave cross platform audio and video into your web pages. jPlayer's comprehensive API allows you to create innovative media solutions while support and ...
A&VE Audio / Video Editor 音频/视频编辑器 A-A Analog-Analog 模模 A-D Analog-Digital 模数 A/D Analog / Digital 模拟/数字 A/V Audio / Video 音频/视频 A/VP Audio / Video Panel 音频视频面板 AA ...
简单的html5 audio和video标签的用法,还不错哦,供小白参考
The Real-time Transport Protocol (RTP) provides a framework for delivery of audio and video across IP networks and unprecedented quality and reliability.
标签可以在HTML5浏览器中播放音频文件。 <audio>默认提供一个控制面板,但是有些时候我们只需要播放声音,控制面板由我们自己来定义其显示的状态。 这里我们可以使用JS来进行控制,代码如下: 复制代码代码...
An ASP.NET Gallery for Sharing Photos, Video, Audio and Other Media
CKEditor 添加Video插件(MP4)并且兼容HTML5 Video插件 1:把video文件复制到ckeditor/plugins/下面 2:ckeditor/config.js 中添加如下: a:在toolbar中['Image','Flash','Video'],配置加入“Video” 项。 b:配置 ...
html5入门代码大全(源码) 包含audio、video、canvas 、communication、forms、geolocation、intro、offline、storage、websocket、workers
html5 audio自定义样式以及播放控制demo。
本应用是利用HTML5提供的Audio标签搭配JQuery开发完成的音乐播放
Web-前端html+css从入门到精通 119. video标签与audio标签.zip
RTP Audio and Video for the Internet