最近在做一个微信端的商城,以前做web端的比较多,手机端做的相对来说要少点,老板说让我用俗称”靠谱的移动前端框架”—-AUI来搭建项目. 当时觉得用不用框架无所谓啦.结果后来写到一半把项目发布到手机上测试的时候才发现出问题了—-在IOS上input输入框根本无法输入啊!我们项目不用考虑太多兼容的问题,所以我测试用的都是谷歌浏览器(个人比较喜欢),在PC端.android机上面一切都很正常!我的内心是崩溃的,一个商城连搜索都输入不了那还有多大用! 后来检查元素时发现了这么个东西:-webkit-u…
h5微信页面在手机微信和微信开发者工具中都能正常显示,但是在pc端微信浏览器上打不开或者数据加载不出来. 原因:pc端微信浏览器不支持ES6语法,我的代码中使用了一些ES6的特性 解决:将ES6转换为ES5的语法.…
使用Geolocation方法存在错误信息error.POSITION_UNAVAILABLE 其实问题不局限于微信端而是iphone升级到ios10后,对获取地理位置信息作出了限制,只有https的方式才能获取 然而用腾讯地图的api可以直接获取,代码如下: <script type="text/javascript" src="https://3gimg.qq.com/lightmap/components/geolocation/geolocation.min.j…
写移动端的时候发现input的虚拟键盘对Ios的手机不是很友好 我的是苹果6 点击的时候经常会挡住input框 针对这个问题找了很多发现都没效果 最后发现用下面这段js就可以解决了 $("input").focus(function () { setTimeout(function () { $(window).scrollTop(window.innerHeight); }, 500); }); 这里有个问题就是会延迟500毫秒 不过能解决问题就行…
再做H5页面的时候,发现audio在手机端和微信端添加了autoplay以后还是不可以自动播放,这是因为手机端为了节约流浪所设置的 通常解决方法是给一个交互事件,一定要是交互事件 标签:<audio loop src="/photo/aa.mp3" id="audio" autoplay preload="auto">该浏览器不支持audio属性</audio> 里面的属性我就不多做解释了,可以自己百度 解决方法: //-…
描述:video 在iphone手机,微信端无法自动播放,ios系统下不能自动播放视频.而且如果没有autoplay属性,在微信端点击一次,弹不出视频,要一直触着两秒后才可以打开视频.如果点击播放的话,还会自动放大到全屏模式 网上的解决方案: 1. <script src="https://act.mcake.com/fangli/2018/wap/commonjs/jquery.min.js"></script> <script type="t…
http://caibaojian.com/browser-ios-or-android.htmlfunction is_weixin() { var ua = window.navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == 'micromessenger') { return true; } else { return false; }} JS判断手机操作系统(ios或android)并跳转到不同下载页面…
前言: 上午有一个移动端的项目负责人问我,在ios系统上样式出现问题,因为内核原因,我改来改去,在ios弄好了,但在安卓有问题了,突然想到了一种办法,既然ios是一种机型,安卓是一种机型,可以检测用户的手机是哪一种机型,进而加载哪种方法.于是乎,上网查阅了一下,原理:通过判断浏览器的userAgent,用正则来判断手机是否是ios和Android客户端.经测试,有效.总结转载如下: 正文: 第一种: <script type="text/javascript"> var u…
// html模版中的 此处结合了weui样式整合的微信手机端片段代码(不可直接粘贴复制进行使用)里面含有一些php的写法,可直接略过..###重点参考js代码### <div> <div class="weui-cells weui-cells_form"> <div class="weui-cell weui-cell_switch"> <div class="weui-cell__bd">语音…
JS判断客户端是否是iOS或者Android 参考:http://caibaojian.com/browser-ios-or-android.html function is_weixin() { var ua = window.navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == 'micromessenger') { return true; } else { return false; } } JS判断手…