问题与解决办法
1.微信版本更新之后，第三方网站的网页，在微信中点击页面的图片元素会自动放大。
解决办法：设置Img属性Css样式 img{pointer-events:none}
设置该属性后，图片点击事件会全部失效，之后需要用到图片点击响应效果的，需要在原有img基础上，加上一个遮罩层用来实现点击效果
2.解决微信H5地图导航时，调用高德API，有很多自定义方面的东西需要修改：
<1>如图
红色处按钮处点击能出现导航界面，蓝色部分为自定义的按钮，
那么我们先来看一下官方示例给到的代码
如图所示红色部分为绑定事件，蓝色部分为导航的关键方法
然后需要实现到，自定义的按钮去执行蓝色部分的主要方法
办法很简单，在button处添加onclick事件，然后对click事件进行绑定
onclick="marker.markOnAMAP({name:'中南国际汇',position:marker.getPosition()})"
就能很简单的将高德调用地图的方法很轻易的转换到自己自定义的事件里面去
3.关于移动端字体的设置，如果直接写死单位为px，不同屏幕的终端显示差异会比较大，原因大家应该都清楚，像素作为单位，影响显示的就是终端屏幕的像素比，所以写死px适配效果会很差，那么我们再来看一下另一种方法，也就是用em作为单位去写字体大小，事实上em确实比较好用，各种终端的显示效果都比较一致，但是em有个缺点，那就是换算问题很大，1em=16px，这样换算下去工作量会比较大。然后推荐给大家一种解决办法：
/*实时改变html的fontSize值*/
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt ='orientationchange' in window ?'orientationchange' :'resize',
recalc =function () {
var clientWidth = docEl.clientWidth;
if (!clientWidth)return;
docEl.style.fontSize = (clientWidth /7.5) +'px';
};
if (!doc.addEventListener)return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
4.这是一个简单的问题，就不多做介绍，audio标签在微信端有时候会不自动播放，下面是解决办法：
//解决微信端audio不自动播放
document.addEventListener("WeixinJSBridgeReady", function () {
document.getElementById('music').play();
}, false);
//音乐播放暂停
function changeAudio(){
var audio = document.getElementById('music');
if(audio.paused){
audio.play();//audio.play();// 播放
$(".audio").addClass('rotate')
}
else{
audio.pause();// 暂停
$(".audio").removeClass('rotate')
}
}
网友评论