移动端 - 随笔分类(第2页) - 刘世涛6192

转移动端-webkit-user-select:none导致input/textarea输入框无法输入

摘要：移动端webview中写页面的时候发现个别Android机型会导致input、textareat输入框无法输入（键盘可以弹起，不是webView.requestFocus(View.FOCUS_DOWN);的问题）由于移动端我习惯统一初始化样式：经过试错发现是-webkit-user-selec 阅读全文

posted @ 2018-04-28 17:38 刘世涛6192 阅读(279) 评论(0) 推荐(0)

移动端开发兼容性总结

摘要：每次h5开发，总会遇到一些兼容性bug，现在总结下，供大家参考。 1)定位问题：ios 2)写背景图时最好加上top left 或者0 0 不然写运动效果时容易出现跳 3)防止手机中网页放大和缩小:<meta name="viewport" content="user-scalable=0" /> 阅读全文

posted @ 2018-04-26 10:33 刘世涛6192 阅读(243) 评论(0) 推荐(0)

移动端input 无法获取焦点的问题

摘要：下午遇到一个问题，移动端的input都不能输入了，后来发现是－webkit－user-select ：none ; 在移动端开发中，我们有时有针对性的写一些特殊的重置，比如：其中，－webkit－user-select ：none ；会产生一些问题。这是webkit内核浏览器下的一个bug，具体阅读全文

posted @ 2018-04-26 10:13 刘世涛6192 阅读(3528) 评论(0) 推荐(0)

js－移动端android浏览器中input框被软键盘遮住的问题解决方案

摘要：我遇到的问题：在一个页面里有一个弹出层之前我给我的最外层加了固定定位用了下面的方法也不好使；没有办法我将之改为绝对定位层级变高在加上一个顶部标签通过js计算顶部高度来实现满屏遮挡；前提：关于input框被浏览器软键盘遮挡住的问题，主要是安卓浏览器，下面出一个解决方案：解决方案原理：安卓浏览阅读全文

posted @ 2018-04-25 09:06 刘世涛6192 阅读(1934) 评论(0) 推荐(0)

移动端图片点击放大缩小（例如商品详情时）插件

摘要：使用：代码：阅读全文

posted @ 2018-04-20 08:51 刘世涛6192 阅读(1259) 评论(0) 推荐(0)

移动端居中根据内容自适应提示标签

摘要：//新建提示 function createTips(text,fn){ var tips = $(""); var box = $(""); box.css({"position": "absolute","top": "50%","left":"50%","-webkit-transform": "translate3d(-50%,-50%,0)","transfor... 阅读全文

posted @ 2018-04-20 08:37 刘世涛6192 阅读(205) 评论(0) 推荐(0)

移动端滑动函数（防止滑动时将隐藏部分显示）

摘要：--> ... 阅读全文

posted @ 2018-04-11 10:14 刘世涛6192 阅读(388) 评论(0) 推荐(0)

移动端下滑时加载新数据

摘要：html: js: 阅读全文

posted @ 2018-03-22 08:44 刘世涛6192 阅读(977) 评论(0) 推荐(0)

移动端bug之解决方式

摘要：1、Android中元素被点击时产生的边框: * { -webkit-tap-highlight-color: rgba(250,250,250,0); /*更改点击事件的焦点色*/} 2、去除移动端输入框内阴影: input,textarea { border: 0; /* 方法1 */ -web 阅读全文

posted @ 2018-03-15 10:11 刘世涛6192 阅读(265) 评论(0) 推荐(0)

移动端input验证只允许有数字在safari浏览器一直不成功解决

摘要：或者或者阅读全文

posted @ 2018-03-15 10:08 刘世涛6192 阅读(1330) 评论(0) 推荐(0)

移动端输入框如果类型是number，用户也可以输入汉字和字母

摘要：//input 输入框，要求出入年龄，位数不能超过2位； $('#input-age').on('input',function(e){ e.preventDefault(); var a=$('#input-age').val(); var reg = /^\d+$/g; $('#input-age').attr('type','text'); if(reg.test(e.target... 阅读全文

posted @ 2018-03-13 17:33 刘世涛6192 阅读(517) 评论(0) 推荐(0)

移动端中的陀螺仪

摘要：横竖屏 window下的orientation属性来表示移动端的横竖屏状态，chrome模拟器不支持该属性，只能在真机上测试按照上右下左的顺序，该属性的结果分别是0、90、180、-90 [注意]手机头朝下的切换没有实现 window下的orientationchange事件来监测移动端的横竖屏状阅读全文

posted @ 2018-03-06 16:57 刘世涛6192 阅读(675) 评论(0) 推荐(0)

手机端图片预览和缩放js

摘要：转至：http://blog.sina.com.cn/s/blog_c342e3090102vcxu.html 1.手机端的图片选择和预览《input type="file" id="preview"/》《img id="theImg"/》 var oBtn = document.getEleme 阅读全文

posted @ 2018-02-05 16:23 刘世涛6192 阅读(5010) 评论(0) 推荐(0)

移动端兼容性问题解决方案

摘要：转载：http://www.cnblogs.com/wangpenghui522/p/5398137.html 1. IOS移动端click事件300ms的延迟响应移动设备上的web网页是有300ms延迟的，玩玩会造成按钮点击延迟甚至是点击失效。这是由于区分单击事件和双击屏幕缩放的历史原因造成的, 阅读全文

posted @ 2018-02-01 10:44 刘世涛6192 阅读(266) 评论(0) 推荐(0)

解决ios手机页面overflow scroll滑动很卡的问题

摘要：在移动端html中经常出现横向/纵向滚动的效果,但是在iPhone中滚动速度很慢,感觉不流畅,有种卡卡的感觉,但是在安卓设备上没有这种感觉; 要解决这个问题很简单: 一行代码搞定 -webkit-overflow-scrolling : touch; 阅读全文

posted @ 2018-01-26 16:09 刘世涛6192 阅读(576) 评论(0) 推荐(0)

移动端计算滑动的距离

摘要：代码来源：http://www.lanrenzhijia.com/js/css3/3206.html <html lang="en"><head> <meta charset="UTF-8"> <meta content="width=device-width, initial-scale=1,ma 阅读全文

posted @ 2018-01-26 15:20 刘世涛6192 阅读(969) 评论(0) 推荐(0)

随笔分类 - 移动端