IOS微信搖一搖聲音無(wú)法播放的解決辦法
在IOS中第一次調(diào)用play方法播放音頻會(huì)被阻止,必須得等用戶有交互動(dòng)作,比如touchstart,click后才能正常調(diào)用,所以可以在搖一搖之前提醒用戶點(diǎn)擊一下開(kāi)始游戲的按鈕或者給用戶一個(gè)彈窗,用戶點(diǎn)擊的時(shí)候播放一個(gè)超級(jí)短的無(wú)聲音文件,之后替換src,這樣再調(diào)用play方法就可以了。
代碼如下如:
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
<button>開(kāi)始游戲</button>
<audio src="https://daoket.github.io/img/load.mp3" id="audio"></audio>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
$('button').one('touchstart', function () {
var audio = document.getElementById("audio");
audio.play();
audio.setAttribute('src', 'https://daoket.github.io/img/shake.mp3');
audio.load();
$(this).text('游戲進(jìn)行中');
})
/**
* 移動(dòng)端搖一搖
* @params devicemotion 提供設(shè)備加速度信息
*/
window.addEventListener('devicemotion', devicemotionHandler, false);
var x,
y,
z,
last_x,
last_y,
last_z,
last_time = 0,
SHAKE_SPEED = 4000;
function devicemotionHandler (evet) {
var acc = event.accelerationIncludingGravity,
curTime = new Date().getTime(),
diffTime = curTime - last_time;
if (diffTime > 100) {
last_time = curTime;
x = acc.x;
y = acc.y;
z = acc.z;
var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000;
if (speed > SHAKE_SPEED) {
document.getElementById("audio").play()
}
last_x = x;
last_y = y;
last_z = z;
}
}
</script>
</body>
</html>
在線查看
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
ios 流媒體播放器實(shí)現(xiàn)流程及FreeStreamer的使用的示例
本篇文章主要介紹了ios 流媒體播放器實(shí)現(xiàn)流程及FreeStreamer的使用的示例代碼,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2018-01-01
iOS如何利用一句話完成轉(zhuǎn)場(chǎng)動(dòng)畫(huà)
這篇文章主要給大家介紹了關(guān)于iOS如何利用一句話完成轉(zhuǎn)場(chǎng)動(dòng)畫(huà)的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2018-08-08
實(shí)例分析IOS實(shí)現(xiàn)自動(dòng)打包
本篇文章給大家分享了IOS實(shí)現(xiàn)自動(dòng)打包的相關(guān)知識(shí)點(diǎn),以及需要的操作內(nèi)容做了分享,有需要的朋友可以學(xué)習(xí)下。2018-05-05
IOS 獲取已連接的wifi信息的實(shí)現(xiàn)代碼
這篇文章主要介紹了IOS 獲取已連接的wifi信息的實(shí)現(xiàn)代碼的相關(guān)資料,這里提供實(shí)現(xiàn)代碼幫助大家學(xué)習(xí)理解這部分內(nèi)容,需要的朋友可以參考下2017-08-08
iOS10添加本地推送(Local Notification)實(shí)例
這篇文章主要為大家詳細(xì)介紹了iOS10添加本地推送(Local Notification)實(shí)例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-09-09
在IOS系統(tǒng)上滾動(dòng)條滾動(dòng)到指定的位置出現(xiàn)空白頁(yè)面的解決方案
這篇文章主要介紹了 在IOS系統(tǒng)上滾動(dòng)條滾動(dòng)到指定的位置出現(xiàn)空白頁(yè)面的解決方案,需要的朋友可以參考下2017-01-01
iOS 本地視頻和網(wǎng)絡(luò)視頻流播放實(shí)例代碼
本篇文章主要介紹了iOS 本地視頻和網(wǎng)絡(luò)視頻流播放實(shí)例代碼,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
關(guān)于ios配置微信config出現(xiàn)驗(yàn)簽失敗的問(wèn)題解決
這篇文章主要介紹了關(guān)于ios配置微信config出現(xiàn)驗(yàn)簽失敗的問(wèn)題解決方案,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-04-04

