加速度などに連動して音を鳴らすというのをやりたかったんですが、
スマホの仕様から単純にはいかなかったのでメモしておきます。
NG
以下の場合はスマホでは音が鳴りません。(PCでは鳴りました。)
var audio = new Audio();
audio.src = 'sample.mp3';
window.addEventListener('devicemotion', function() {
audio.play();
}, false);
理由は以下だそうです。
英語読めませんが、どうやらスマホではユーザーの行動(clickとかtouchとか)に紐付かないと、Audio.playが有効にならないみたいです。
OK
あらかじめclickやtouchなどのイベントを介して、その中でaudio.load()
を行っておけば、devicemotion
内でも音を鳴らすことができました。
var button = document.getElementById('button'),
audio = new Audio();
audio.src = 'sample.mp3';
button.addEventListener('click', function() {
audio.load();
}, false);
window.addEventListener('devicemotion', function() {
audio.play();
}, false);
このような演出を取り入れたい場合、デザイン上でなんらかのクリック動作をユーザーに促すように設計しておくとよさそうですね。