html5 的<audio> 音频 audio的“坑”
<audio>标签是html5的一个非常有意义的特性。告别的flash的时代。它的属性有:
autoplay:音频就绪后马上播放
controls:出现该属性,向用户显示播放的控件。
loop:是否在音频结束时候从新播放
preload:如果出现该属性,则在页面加载时候进行加载。
src:要播放的音频的URL。
方法有:
load():从新加载资源。
play():开始播放。
pause() :暂停播放。
这些都是基础的知识点。如果我们需要让音频自动播放的时候。在iphone中,我们发现是无法实现的 。
这里解决方案是在此页面的
document.addEventListener('touchstart', function(){ document.querySelector("#musicBox").play()
}, true);
能够实现播放的功能(意思是必须手动的触发)。
要是自动触发,必须事件机制有所了解。
在Mouse事件中:
var Elem = document.getElementById('pp');Elem.addEventListener('click', function(){ alert(111)}, true);var evt = document.createEvent('MouseEvent');evt.initMouseEvent( 'click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );Elem.dispatchEvent(evt);
同理在touch的事件中:
var Elem = document.getElementById('pp');
Elem.addEventListener('touchstart', function(){
alert(111)
}, true);
var evt = document.createEvent('TouchEvent');
evt.initTouchEvent( 'click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );
Elem.dispatchEvent(evt);
实现一个类似于jquery 的trigger的功能点
html5 的<audio> 音频 audio的“坑”的更多相关文章
- HTML5视频Video 音频Audio
视频协议 视频格式 Flash HTML5 HTTP flv HTTP f4v HTTP mp4 HTTP m3u8 HTTP webm HTTP ogg RTMP flv RTMP f4v RTMP ...
- HTML5音视频播放(Video,Audio)和常见的坑处理
1. 前言背景 在HTML5出现之前,Web页面访问音视频主要是通过Flash,Activex插件,还有微软后来推出的silverlight来展现的,尽管FLASH曾经风靡全球,但是随着互联网的不断发 ...
- HTML5 音频 <audio>
HTML5 提供了播放音频的标准. 一.Web 上的音频 直到现在,仍然不存在一项旨在网页上播放音频的标准. 今天,大多数音频是通过插件(比如 Flash)来播放的.然而,并非所有浏览器都拥有同样的插 ...
- html5 audio音频播放全解析
序 html5开启了一个新时代,因为它让浏览器本身变得不那么被动,audio api就是一个典型的列子,在html5还没确定之前,如果想要在网页上听音乐看视频唯一的办法就是用flash意思是当你没有给 ...
- HTML5之Audio音频标签学习
HTML5中的新元素标签 src:音频文件路径. autobuffer:设置是否在页面加载时自动缓冲音频. autoplay:设置音频是否自动播放. loop:设置音频是否要循环播放. control ...
- HTML5无插件多媒体Media——音频audio与视频video
文件日志地址 http://blog.csdn.net/q1056843325/article/details/60336226 音频与视频现在已经变得越来越流行 各个网站为了保证跨浏览器的兼容性 ...
- Html5视频播放器-VideoJS+Audio标签实现视频,音频及字幕同步播放
一,VideoJS介绍 引用脚本,videojs很为你着想,直接cdn了,你都不需要下载这些代码放入自己的网站 <link href=”http://vjs.zencdn.net/c/video ...
- HTML5 学习07——Video(视频)Audio(音频)
<video> 元素:提供了 播放.暂停和音量控件来控制视频. width 和 height 属性:控制视频的尺寸 <video> 与</video> 标签之间插入 ...
- css总结16:HTML5 多媒体音频(Audio)视频(video )
1 显示嵌入网页中的 MP3 文件: <embed height="50" width="100" src="horse.mp3"&g ...
随机推荐
- Internet连接共享访问,依赖服务或组无法启动
问题与现象 在启用本地Internet连接共享给VMware的虚拟网卡时,出现了如下错误提示,导致无法启用(如图一示): Internet连接共享访问被启用时,出现了一个错误.依赖服务或组无法启动 图 ...
- Helpers\Tags
Helpers\Tags The tags helper is a collection of useful methods: Tags::clean($data) Clean function to ...
- oracle checkpoint 详解
Oracle checkpoint详解 topcheckpoint扫盲 top什么是checkpoint 在数据库系统中,写日志和写数据文件是数据库中IO消耗最大的两种操作,在这两种操作中写数据文件属 ...
- [改善Java代码]非稳定排序推荐使用List
我们知道Set与List的最大区别就是Set中的元素不可以重复(这个重复指的equals方法的返回值相等),其他方面则没有太大的区别了,在Set的实现类中有一个比较常用的类需要了解一下:TreeSet ...
- DisableExplicitGC和Direct ByteBuffer
直接堆外内存请参见:http://blog.csdn.net/lantian0802/article/details/39257087 JVM调优请参见:http://hllvm.group.itey ...
- (原创)monitor H3C switch with cacti
H3C交换机需要做的操作 [H3C]snmp-agent #H3C默认SNMP是关闭的,需要先开启 [H3C]snmp-agent community read public #设置团体名[publi ...
- HTML5和Web Apps框架和方法
单页: 1jQuery Mobile 该框架以其基于AJAX的导航系统和可使用主题的ThemeRoller设计而闻名.支持Android,ios,Windows Phone,webOs等.编程模式为C ...
- django 学习-3 模板变量
1.vim learn/home.html <!DOCTYPE html><html><head> <title>{{title}}< ...
- DOS批处理命令-SET命令
SET是专门用来创建.设置.查看或删除环境变量. 总结了下,SET的使用语法一般有下面几种 1.SET 变量名=变量值 这边有一点要注意的,就是变量名和变量值中间的等号两端不需要也不能有空格 看看下面 ...
- 新年第一次分享sqlserver技术
走向DBA[MSSQL篇] - 从SQL语句的角度提高数据库的访问性能 最近公司来一个非常虎的DBA,10几年的经验,这里就称之为蔡老师吧,在征得我们蔡老同意的前提下 ,我们来分享一下蔡老给我们带来的 ...