总结微信公众平台网页开发中遇到的ios的兼容问题
程序员文章站
2024-01-26 23:23:10
1. ios中音频不自动播放; 原因:出于节省流量的初衷,ios系统禁止音视频自动播放。 解决方案:使用微信的JS-SDK。 DEMO: 先引入微信的JS-SDK, 然后在wx.ready中调用play方法播放。 2. 微信升级到7.0版本以后,填写表单信息弹出键盘会把页面顶上去,键盘消失的时候页面 ......
1. ios中音频不自动播放;
原因:出于节省流量的初衷,ios系统禁止音视频自动播放。
解决方案:使用微信的js-sdk。
demo:
先引入微信的js-sdk,
1 <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
然后在wx.ready中调用play方法播放。
1 var audio = document.getelementbyid('bgmusic'); 2 autoplayaudio(); 3 function autoplayaudio() { 4 wx.config({ 5 // 配置信息, 即使不正确也能使用 wx.ready 6 debug: false, 7 appid: '', 8 timestamp: 1, 9 noncestr: '', 10 signature: '', 11 jsapilist: [] 12 }); 13 wx.ready(function() { 14 audio.play(); 15 }); 16 }
2. 微信升级到7.0版本以后,填写表单信息弹出键盘会把页面顶上去,键盘消失的时候页面不自动下来;
解决方案:使用onblur方法在表单失去焦点的时候让页面滚动到最顶部。
demo:
1 <form class="form" action="" method=""> 2 <div><label for="idnumber">身份证号</label><input type="text" name="idnumber" onblur="window.scrollto(0, 0);" id="idnumber"></div> 3 </form>
3. 去除移动端点击时的背景;
1 *{ 2 -webkit-tap-highlight-color: rgba(0,0,0,0); 3 -webkit-tap-highlight-color:transparent; 4 }
4. 去掉input框的默认样式;
1 input { 2 background-color: transparent;/*背景变透明*/ 3 filter: alpha(opacity=0); /*androd*/ 4 appearance: none; /*去除系统默认appearance的样式,常用于ios下移除原生样式(下拉框去掉右侧图标等)*/ 5 -moz-appearance: none; 6 -webkit-appearance: none; 7 }
推荐阅读
-
总结微信公众平台网页开发中遇到的ios的兼容问题
-
微信公众平台网页授权获取用户基本信息中授权回调域名设置的变动,基本信息回调
-
微信公众平台开发者 - 微信开发,xml中的php变量无法解析
-
微信公众平台网页授权获取用户基本信息中授权回调域名设置的变动,基本信息回调_PHP教程
-
微信公众平台网页授权获取用户基本信息中授权回调域名设置的变动_PHP
-
微信公众平台网页授权获取用户基本信息中授权回调域名设置的变动
-
微信公众平台网页授权获取用户基本信息中授权回调域名设置的变动
-
【微信公众平台开发】利用客服接口向用户发送网页授权的消息
-
关于微信公众平台开发中换行的问题!!!!
-
关于微信公众平台开发中换行的问题!!!!