在输入车牌号的时候,因为很多车牌号都是数字字母混合排列的,所以如果用输入法输入就需要频繁切换数字跟字母,有点麻烦. 在这里我们就用自定义一个弹出框代替键盘来使用. 1.首先,要禁止掉文本框弹出输入法,这里我用readonly <input class="selectCarBtn" readonly="readonly" type="text" placeholder="输入车牌号"> 2.其次需要一个键盘弹框,这里…

在没结合css3的transform实现平滑过渡前,我都是用的jquery的animate方法,此方法在PC端基本看不出来有稍微卡顿的现象,但是在性能不高的手机上使用该方法,就会有明显的卡顿现象,不够平滑,而且,在移动端H5页面中很多人使用的js库是zeptoJS,所以要想使用animate方法还要额外引用一个fx.js的插件,这无疑又增加了页面的体积,增加了服务器的请求负担,这显然不是最好的解决办法.那么,今天,本人就给大家分享一个利用css3的transform并结合transition来实…

项目进行中...随时更新 这里记录了一些手机端调试的方式 一 css 1.文字超过span宽度显示...(单行文字) .topWrap .introduce span { padding: 0 17px; display: inline-block; border-radius: 5px; height: 18px; line-height: 18px; margin-top: 15px; max-height: 18px; max-width: 90%; white-space:nowrap;…

已测适用于ios,某些安卓手机微信下播放视频会出现播放器控件(这个实在是无力吐槽噢,因为之前还遇到过微信播放完视频后竟然无法退出全屏出现广告的情况,只有播放完后刷新页面并且要放到框架页里才能屏蔽微信视频广告!),之前用canvans渲染,感觉不够太完美,弄成背景切换形式得(用背景切换形式可以完美解决当一个容器有transform:rotate(90deg)属性时自适应百分比问题,若是canvans需去计算高宽太麻烦还需考虑不同系统). 想要手机端h5播放时不自动全屏比想象的简单,看加粗部分,一般…

js仿手机端九宫格登录功能 最近闲来无事把以前无聊时开发的小东西拿出来和大家分享下,写的不好的请指出,我会及时修改.谢谢. 功能及方法逻辑都注释在代码中.所以麻烦大家直接看代码. 效果如下: 话不多说直接上代码: js部分:   <script> $(function () { var urlinfo = window.location.href; var UserName = urlinfo.split("_")[1]; //查看用户是否设置手势密码,如果设置调用add,…

非常实用的js判断手机端操作系统(Andorid/IOS),并自动跳转相应下载界面 androidURL = "http://xxx/xxx.apk"; var browser = { versions: function() { var u = navigator.userAgent, app = navigator.appVersion; return { android: u.indexOf('Android') > -1 || u.indexOf('Linux') >…

利用原生js做手机端网页自适应解决方案rem布局 刚开始我用的是下面这段代码,然后js通过外部链接引入,最后每次用手机刷新网页的时候都会出现缩略图 function getRem(pwidth, prem) { var html = document.getElementsByTagName("html")[0]; var oWidth = document.body.clientWidth || document.documentElement.clientWidth; html.s…

if (window.location.toString().indexOf('pref=padindex') != -1) { } else { if (/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amo…

//判断手机端操作系统(Andorid/IOS),并自动跳转相应下载界面 androidURL ="http://xxx/xxx.apk"; var browser = { versions: function() { var u = navigator.userAgent, app = navigator.appVersion; return { android: u.indexOf("Android") > -1 || u.indexOf("Li…

关于input光标在手机端偏移 问题根本:不要使用line-height垂直居中. 解决方法:可直接定义height,然后高度由上下padding值撑开. 移动端清除input光标 ios input 添加 readonly unselectable="on" 属性,光标依旧还在 input聚焦时马上让它失焦,代码 $('input[readonly]').on('focus', function() { $(this).trigger('blur'); }); 亲测在苹果手机可行 d…

var topValue = 0,// 上次滚动条到顶部的距离 interval = null;// 定时器 contactsList = document.getElementById("contactsList"); contactsList.onscroll = function() { //我项目中的contactsList滚动 if(interval == null) {// 未发起时,启动定时器,1秒1执行 interval = setInterval(function (…

首先这里有个new FileReader()的概念,这是h5新增的,用来把文件读入内存,并且读取文件中的数据.FileReader接口提供了一个异步API,使用该API可以在浏览器主线程中异步访问文件系统,读取文件中的数据,他有个readAsDataURL的方法,可以读取url,同时input file的change事件里面有个this.file是个数组,反应的当前上传文件的具体参数 打印出来有这些,可以判断当前上传文件类型和大小,通过readAsDataURL(this.files[0]),就…

一:本文提供两种解决方案 1.终端解决方案(最优,建议选择) 2.web解决方案 导语: iPhone X的出现,一方面对于整个手机行业的发展极具创新领头羊的作用,另一方面也对现有业务的页面适配带来了新的挑战. 对于手Q中的各业务来说,受iPhone X影响的H5页面挺多,应该采取什么快速有效的办法来应对呢? 目前的H5页面可以分为通栏页面和非通栏页面两种,每种页面都可能有底部操作栏,具体如下: 通栏页面 顶部通栏 某些业务的一级页面多数使用了顶部通栏banner的效果,由于iPhone X在状…

github地址:weexSafeKeyboard 效果图: 技术依赖:框架:weex+vue 弹出层:weex-ui 图标:iconfont 说明:1.如果不想用到weex-ui,可以把inputkey.vue文件里的wxc-popup组件去掉,按自己的弹窗实现即可: 2.删除.大小写.空格图标用的是iconfont;如不想用请自行替换; 本项目是放在本地,以安卓为例:android/app/src/main/assets/iconfont 3.密码可见.不可见图标按钮用的是common.js…

<script type="text/javascript"> $(document).ready(function(e) { var u = navigator.userAgent, app = navigator.appVersion; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器 var isiOS = !!u.match(/…

FastClick 是一个简单,易于使用的JS库用于消除在移动浏览器上触发click事件与一个物理Tap(敲击)之间的300延迟. 对于非移动浏览器不启作用,禁用缩放标签. <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 引入插件步骤 ①在HTML页面中添加 <script type='application/javascript' src='/path/to…

html: <a href="javascript:;" id="copyBtn" class="f-r tac" data-clipboard-text="111" data-clipboard-action="copy" >点击复制ID</a> js: var clipboard = new Clipboard("#copyBtn");clipboard.on…

pinchzoom.js 这个插件可以简单的实现这一功能 <div class="big_pos_img page"> <div class="pinch-zoom" id="test" data-scale="1"> <img src="images/timg.jpg"/> </div> </div> <script src="j…

$('body').height($('body')[0].clientHeight); 以上是背景即BODY被顶起的解决办法. 如果是footer被顶起,则可以用判断解决, $('input').focus(function(){ $('.share').css('display','none'); }) $('input').blur(function(){ $('.share').css('display','block'); })…

/*判断当前设备是平板.安卓.苹果设备*/ <script type="text/javascript"> function fBrowserRedirect(){ var sUserAgent = navigator.userAgent.toLowerCase(); alert(sUserAgent); //获取浏览器和手机的信息 //匹配信息里的关键字 var bIsIpad = sUserAgent.match(/ipad/i) == "ipad"…

_obj = {}; /*点击弹出分类*/_obj.openZZ=function(){ document.getElementById("app_screen01").style.display="block"; //分类弹出时显示遮罩层 _Box_object.shownavigation(); //分类动画弹出效果}/*点击隐藏分类*/_obj.openZZ2=function(){ document.getElementById("app_scre…

<script type="text/javascript">     function browserRedirect() {     var sUserAgent = navigator.userAgent.toLowerCase();     var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";     var bIsIphoneOs = sUserAgent.match(/iphone os/i)…

<meta content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/> <meta name="apple-mobile-web-app-capable" content="no" /> <meta name="format-detection&q…

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name = "viewport" content= "width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"…

方法一(网页上判断) if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {   var loadDateTime = new Date();   window.setTimeout(function() {    var timeOutDateTime = new Date();    if (timeOutDateTime - loadDateTime < 5000) {     window.location = "要跳转的…

//得到手机屏幕的宽度 let htmlWidth = document.documentElement.clientWidth || document.body.clientWidth; if(htmlWidth>750){htmlWidth=750} //得到html的Dom元素 let htmlDom = document.getElementsByTagName('html')[0]; //设置根元素字体大小 htmlDom.style.fontSize = htmlWidth/20 +…

var browser = { versions: function() { var u = navigator.userAgent, app = navigator.appVersion; return {//移动终端浏览器版本信息 trident: u.indexOf(, //IE内核 presto: u.indexOf(, //opera内核 webKit: u.indexOf(, //苹果.谷歌内核 gecko: u.indexOf( && u.indexOf(, //火狐内核 m…

/** * [isMobile 判断平台] * @param test: 0:iPhone 1:Android */ function ismobile(test){ var u = navigator.userAgent, app = navigator.appVersion; if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD…

fiddler抓包工具 https抓取 ios手机端抓取  转载链接:https://www.cnblogs.com/bais/p/9118297.html   抓取pc端https请求,ios手机端H5页面https请求   app内嵌H5页面  亲试均能抓到 Fiddler的原理是以代理web服务器的形式工作,使用代理地址127.0.0.1,端口8888: 方便起见,先来pc抓取https的步骤 1.cmd运行certmgr.msc命令打开如下对话框,查找所有关于fiddler的证书  全部…

http://jingyan.baidu.com/article/cdddd41c61823e53cb00e198.html 参考网址 浏览:11532 | 更新:2014-04-22 16:51 第一种方法: <script> if(navigator.platform.indexOf('Win32')!=-1){ //pc //window.location.href="电脑网址"; }else{ //shouji window.location.href="…