手机摇一摇功能的总结

分析：监控用户摇的动作，并且播放声音

主要功能就是上面两步，实现监控用户是否在摇，shake.js 解决了这个问题，

var myShakeEvent = new Shake({
    threshold: 7, // 摇动阈值
    timeout: 500 // 事件发生频率，是可选值
});
// 开始监听
myShakeEvent.start();

// 绑定函数
window.addEventListener('shake', shakeEventDidOccur, false);

function shakeEventDidOccur () {
	//回调函数
	// 在这里执行摇后的事件
}

播放声音的两种方法

第一种利用h5 audio播放声音

<audio  id="media">
	<source src="coin.mp3"/>
</audio>

// 利用play() 播放声音
document.getElementById("media").paly();

缺点：在移动端的qq浏览器、苹果原生浏览器等 不能播放声音，h5 的兼容还是存在的

使用sound.js 播放声音

// 在html中添加一个 dom元素，用来添加声音对象
<div id="ios_ms"></div>
// 加载 sound.js
// 这里利用的是 jquery的插件
soundManager.setup({
    url: 'swf/',
	onready: function() {
		soundManager.createSound({
		id: 'msg',
		autoLoad: true,
		autoPlay: false,
		url: './coin.mp3'
		});
	}
});
// 添加事件
$('#ios_ms').click(function () {
	soundManager.play('msg');
});

// 在回调函数中，用trigger 触发click事件来播放声音
$('#ios_ms').trigger('click');

sound.js网址

最后这个问题还是么有解决了，怎样在苹果手机端摇一摇播放声音呢？

参考网址

demo地址

楼主博客