总结微信公众平台网页开发中遇到的ios的兼容问题
1. ios中音频不自动播放;
原因:出于节省流量的初衷,ios系统禁止音视频自动播放。
解决方案:使用微信的JS-SDK。
DEMO:
先引入微信的JS-SDK,
<script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
然后在wx.ready中调用play方法播放。
var audio = document.getElementById('bgmusic');
autoPlayAudio();
function autoPlayAudio() {
wx.config({
// 配置信息, 即使不正确也能使用 wx.ready
debug: false,
appId: '',
timestamp: 1,
nonceStr: '',
signature: '',
jsApiList: []
});
wx.ready(function() {
audio.play();
});
}
2. 微信升级到7.0版本以后,填写表单信息弹出键盘会把页面顶上去,键盘消失的时候页面不自动下来;
解决方案:使用onblur方法在表单失去焦点的时候让页面滚动到最顶部。
DEMO:
<form class="form" action="" method="">
<div><label for="idNumber">身份证号</label><input type="text" name="idNumber" onblur="window.scrollTo(0, 0);" id="idNumber"></div>
</form>
3. 去除移动端点击时的背景;
*{
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color:transparent;
}
4. 去掉input框的默认样式;
input {
background-color: transparent;/*背景变透明*/
filter: alpha(opacity=0); /*androd*/
appearance: none; /*去除系统默认appearance的样式,常用于IOS下移除原生样式(下拉框去掉右侧图标等)*/
-moz-appearance: none;
-webkit-appearance: none;
}
总结微信公众平台网页开发中遇到的ios的兼容问题的更多相关文章
- 微信公众平台网页开发实战--3.利用JSSDK在网页中获取地理位置(HTML5+jQuery)
复制一份JSSDK环境,创建一份index.html文件,结构如图7.1所示. 图7.1 7.1节文件结构 在location.js中,封装“getLocation”接口,如下: 01 wxJSSD ...
- 微信公众平台应用开发:方法、技巧与案例--柳峰,Java语言版本
他本人的博客:http://blog.csdn.net/lyq8479 作者简介: 刘运强,网名“柳峰”,资深微信公众平台应用开发工程师,国内微信公众平台应用开发的先驱之一,项目经验丰富.他还是一位资 ...
- 微信公众平台网页获取用户OpenID方法
下面我们一起来看看关于微信公众平台网页获取用户OpenID方法,有需要了解的朋友可以一起来看看吧.用户点击微信自定义菜单view类型按钮后,微信客户端将会打开开发者在按钮中填写的url值 (即网页链接 ...
- 【课程分享】ASP.NET MVC5&微信公众平台整合开发实战(响应式布局、JQuery Mobile,Windows Azure、微信核心开发)
对这个课程有兴趣的,能够联系我QQ2748165793 基础知识储备 ASP.NET MVC 5基础(6讲) 第一讲-初识ASP.NET MVC并搭建整合开发环境 第二讲-深入MVC开发模式 第三讲- ...
- 微信公众平台PHP开发
p=932" style="color: rgb(255, 153, 0); text-decoration: none;">微信公众平台PHP开发 2013.05 ...
- 微信公众平台开发 - 动手篇。使用weinxinFundation开始一个微信公众平台的开发
本文主要讲解如何使用 weinxinFundation 进行二次开发. 步骤如下: 1.创建新的web项目. 在eclipse里新建一个dynamicly web project,比如本文叫weixi ...
- 用node.js进行微信公众平台的开发
基本原理 用nodejs怎样来实现对微信公众平台的开发呢? 别的就不多说了,先来简单介绍微信公众平台的基本原理. 微信服务器就相当于一个转发服务器,终端(手机.Pad等)发起请求至微信服务器,微信服务 ...
- 基于微信公众平台的开发(清华大学第二讲)_Alien的笔记
基于微信公众平台的开发(清华大学第二讲)_Alien的笔记 基于微信公众平台的开发(清华大学第二讲)
- C#微信公众平台账号开发,从零到整,步骤详细。
想到微信的火热,想到其他公司开发手游,如雷电,酷跑类的,都不是很火,但是弱智的“打飞机”和“天天酷跑”却是那么火热.于是乎,想做个微信营销的软件.首先想到的是手机连电脑wifi,用抓包工具抓微信的包, ...
随机推荐
- xml、网络编程、 反射
XML 常用于配置文件.传输数据. <?xml version="1.0" encoding="UTF-8"?><persons> &l ...
- Swagger使用教程大全,从入门到精通
Swagger是遵守OpenAPI规范(OAS)的世界上最大的API框架开发工具,可在整个API生命周期内进行开发,从设计和文档到测试和部署.它提供了许多试用的工具来帮助开发者进行接口开发,如及时接口 ...
- SSM-SpringMVC-33:SpringMVC中拦截器Interceptor讲解
------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 拦截器Interceptor: 对处理方法进行双向的拦截,可以对其做日志记录等 我选择的是实现Handler ...
- SSM-SpringMVC-15:SpringMVC中小论注解式开发之通配符篇
------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 此处改了下标题,小论,为什么不说大话了呢?哎,质量不够啊,通配符篇提取不出更多可以讲的滔滔不绝的套路 通配符 ...
- SSM-Spring-22:Spring+Mybatis+JavaWeb的整合
------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 众所周知,框架Spring来整合别的框架,但是Mybatis出现的晚,Spring就没有给他提供支持,那怎么办 ...
- 第一章——机器学习总览(The Machine Learning Landscape)
本章介绍了机器学习的一些基本概念,已经应用场景.这部分知识在其它地方也经常看到,不再赘述. 这里只记录一些作者提到的,有趣的知识点. 回归(regression)名字的来源:这是由Francis Ga ...
- Java 并行与并发
Java 并行与并发 注意两个词:并行(Concurrent) 并发(Parallel) 并行:是逻辑上同时发生,指在某一个时间内同时运行多个程序 并发:是物理上同时发生,指在某一个时间点同时运行多个 ...
- bootstrap模态框内容替换时会重新触发模态框?<a>标签到底有哪些特殊的特性呢?
segmentfault提问 这个问题我将bootstrap导航栏的<a>去除就解决了,那么问题来了,<a>标签到底有哪些特殊的特性呢? 主要属性href 链接href 这是一 ...
- js中函数的写法
js提供了灵活的函数写法,我们常见的函数写法和调用可能是: function ask(){ console.log(1); } ask(); 这样就完成了函数的定义和调用,司空见惯. 还有js里面的匿 ...
- 我的Python之旅第三天
一 编码操作 1 编码 enconde() 英文字符编码为"utf-8"时,一个字符占一个字节. s1='abcdef' b1=s1.encode('utf-8') print(b ...