html5手机端播放音效不卡的方法

html5手机端播放音效不卡的方法
线下载http://wxserver.knowway.cn/solosea/js/audioEngine.js 这个是性能不错

然后直接播放音效就可以了
audioEngine.playEffect(‘/solosea1/music/laidian.mp3‘, false);

如果切换不了 可以先stop 然后再play
audioEngine.stopEffect(‘/hcfabuhui/music/2.mp3‘);

如果延迟 是其他代码性能影响了 预加载也没用

还有个更好的方法用creatjs里面的音乐框架

<pre>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
html,body{
width:750px;
height:750px;
background: #000;
}
</style>
</head>
<body>
<script type="text/javascript" src="/liuanchewei/js/createjs.js"></script>
<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.js"></script>

<script>
$(function () {
createjs.Sound.registerSound( {src:"/liuanchewei/audio/type.mp3", id:"tap"} );
})
$(‘body‘).on(‘click‘,function () {
createjs.Sound.play("tap");
})
</script>
</body>
</html>
</pre>
ps:刚进入页面 因为要注册 所以要等一会再按就不会延迟了

原文地址:https://www.cnblogs.com/newmiracle/p/11875313.html

时间: 2024-10-08 22:52:36

html5手机端播放音效不卡的方法的相关文章

HTML5手机端拍照上传

1.accept="image/*" capture="camera" 自动调用手机端拍照功能 accept="image/*" capture="camera" 2.当表单提交时候有文件的时候,需要加上 var formData = new FormData($( "form" )[0]); 3.示例代码: <!DOCTYPE html> <html> <head> &

HTML5手机端手指滑动上拉加载代码

在线预览   源码下载 HTML5手机端手指滑动上拉加载代码是一款通过jquery实现tab切换和上拉加载更多的效果,适用于手机端页面开发.该特效适用浏览器:360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗. 不支持IE8及以下浏览器. 加入前端爱好者QQ群(123235875) 点击加群,共同交流进度!

HTML5+ 手机端录音和播放录音

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>录音播放</title> <script type=&quo

HTML5+ 手机端相册的操作

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>WebApp启动页</title> <script type

[共通]手机端网页开发问题及解决方法整理

Q1:手机端开发网页,界面适应问题.A1: <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> width - viewport的宽度 height - viewport的高度    initial-scale - 初始的缩放比例    minimum-scale - 允许用户缩放到的最小比

html5手机端定位

由于项目需要,不得不研究一下手机端的定位. 起初想到的是HTML5定位,本地测试下来,安卓没什么问题,IOS报错,提示不支持http协议.由于后端除了经纬度,还需要城市名之类的详细数据,便调研了一下高德地图.高德地图确实好用,拿到的数据很全面.很快调试完上了测试服务器,结果意外发现一个问题--就是在4G的情况下,微信和QQ直接就是无法获取位置!坑啊,无奈只能转换思路,利用微信JSSDK定位和QQ的接口分别获取到经纬度之后,通过高德地图查询位置的详细信息,当然在浏览器下还是直接利用高德地图来定位.

html5手机端的点击弹出侧边滑动菜单代码

效果预览:http://hovertree.com/texiao/html5/19/ 本效果适用于移动设备,可以使用手机等浏览效果. 源码下载:http://hovertree.com/h/bjaf/mwvn0mxi.htm 本实例用到了toggleClass方法,请参考:http://hovertree.com/h/bjaf/attributes_toggleclass.htm 代码如下: 1 <!doctype html> 2 <html lang="zh">

解决HTML5手机端字体小的问题

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> </head> <body> 这样,在手机上显示的字体大小才正常

手机端H5获取当前城市的方法

移动端的H5页面提供了定位的功能,那么如何实现一个最简单的需求-----获取用户当前城市? 你可能搜一下就会找到N篇博客介绍,但是你会发现你看完大段代码之后还是没搞清楚,为了便于大家理解,我精简了代码,只保留了必要的部分. 1.在html页面引入百度地图API(文档地址:http://developer.baidu.com/map/wiki/index.php?title=jspopular/guide/introduction) <script src="http://api.map.b