document.addEventListener("deviceready", onDeviceready);
var pic = new Array('car.png', 'house.png', 'money.png');
var name = new Array("车房钱");
var all_roll = 0;
var u_roll = 0;
function onDeviceready() {
console.log('启动。。。');
$('#test1').click(function () {
//重置样式
$("#shake").css("display","none");
$('#test1').text("再摇一次");
$("#yaoimg").animate({
height: '0',
width: '0',
borderWidth:'0px'
});
$('#heci').css("display", "none");
$('#shakeimg').css("display", "none");
console.log('触发按钮');
startWatch();
});
}
// ---用于处理动画---
function start() {
var rang = Math.floor(Math.random() * 3); //随机生成0-2的数字，方便取出图片
console.log(rang);
$('#shakeimg').attr("src", "img/" + pic[rang]);
console.log(pic[rang]);
$('#heci').text("恭喜你，摇出了：" + name[rang] + "!!!");
console.log(name[rang]);
$("#shakebottom").animate({
height: '+=150px',
marginTop: '0px'
});
console.log("下滑1");
$("#shaketop").animate({
height: '+=150px',
marginBottom: '0px'
}, function () { //用动画显示随机生成的图片
$("#yaoimg").animate({
height: '50%',
width: '80%',
opacity: '1',
borderWidth:'5px'
});
$("#shakeimg").css({
"height": "150px",
"width": "150px",
"display": "block"
});
console.log("显示照片");
$("#heci").fadeIn(2000);
console.log("显示文字");
$("#shake").css("display","none");
});
console.log('上滑1');
}
//---监视设备的加速度
function startWatch() {
//每0.3s更新一次加速度信息
var options = {
frequency: 300
};
wachID = navigator.accelerometer.watchAcceleration(onSuccess, onError, options);
console.log('调用插件');
console.log(wachID);
}
//---停止监视设备的加速度
function stopWatch() {
u_roll = 0;
all_roll = 0;
navigator.accelerometer.clearWatch(wachID);
}
//---获取加速度成功事件
function onSuccess(accelerometer) {
var pow_v = Math.pow(accelerometer.x, 2) + Math.pow(accelerometer.y, 2) + Math.pow(accelerometer.z, 2);
var v = Math.sqrt(pow_v);
console.log(u_roll);
if (v > 15) {
all_roll++; //全部摇动次数
u_roll++; //有效摇动次数
navigator.vibrate(300); //震动反馈
if (u_roll > 1) { //判定这个为摇动，开始显示图片
//摇一摇的动画
$("#shake").css("display","block");
$("#shakebottom").animate({
height: '-=150px',
marginTop: '150px'
});
console.log("下滑");
$("#shaketop").animate({
height: '-=150px',
marginBottom: '150px'
});
console.log('上滑');
stopWatch();
console.log("停止插件");
//调用函数开始显示图片
start();
console.log('显示动画并开始显示图片');
}
} else {
all_roll++;
console.log('摇晃角度不够。');
}
}
//---获取加速度失败事件
function onError() {
alert("错误！");
}
如果觉得《微信摇一摇插件ios_解决ios无法触发摇一摇兼容 Cordova实现模仿微信摇一摇》对你有帮助，请点赞、收藏，并留下你的观点哦！
