总结微信公众平台网页开发中遇到的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,用抓包工具抓微信的包, ...
随机推荐
- sqlilabs 1-4
near '1' --+ ' LIMIT 0,1 ?id=999' union select 1,database(),5 --+ 当前数据库?id=999' union select 1,user( ...
- 配置teredo,启用ipv6,xx-net
最近使用XX-NET科学上网 ,提示要配置使用IPv6.根据github的上win10配置ipv6方式(https://github.com/XX-net/XX-Net/wiki/IPv6-Win10 ...
- java并发包java.util.concurrent详解
线程池ThreadPoolExecutor的使用 并发容器之CopyOnWriteArrayList 并发容器之CopyOnWriteArraySet 数据结构之ConcurrentHashMap,区 ...
- HTML和CSS前端基础
Html标题 <h1>这是一级标题</h1> <h2>这是二级标题</h2> <h3>这是三级标题</h3> Html段落.换行 ...
- springboot整合shiro后报java.lang.ClassCastExcepting异常
最近搭一个springboot的框架,整合了shiro和redis,由于平常习惯用热部署,所以自然的引入了热部署的包,但是引入后报如下错误: 没错,这个问题害我搞了一天,后来删除热部署,项目正常的跑飞 ...
- JS中清空字符串前后空格
在JS 操作的时候 长期会有对字符串的操作, 但是在JS 中不像在C#中 有字符串的方法 Trim() 来对字符串进行处理 . 所以自己写一个对字符串前后清楚空格的方法还是有必要的 以免以后忘记了 ...
- Scrapy 1.4 文档 04 例子
最好的学习方法是举例说明,Scrapy也不例外. 因此,我们有一个名为 quotesbot 的 Scrapy 项目,您可以通过它来学习更多关于 Scrapy 的知识. 它包含两个用于http://qu ...
- storage.go
package storage import ( "fmt" "os" ) const DEFAULT_STORAGE_ENGINE = &qu ...
- 安卓---RedioButton(单选按钮)、CheckBox(复选按钮)
<RadioGroup android:layout_width="fill_parent" android:layout_height="wrap_content ...
- guid.go
] = byte(g) hex.Encode(h[:], b[:]) return h }