移动端常见问题

 

 

1：ios下input为type=button属性disabled设置true,会出现样式文字和背景异常问题

解决方案:使用opacity=1来解决

 

2：对非可点击元素如(label,span)监听click事件，部分ios版本下不会触发

解决方案:css增加cursor:pointer就搞定了

 

3：移动端1px边框

比如按钮的box的class为btn
.btn:before{
  content:'';
  position: absolute;
  top: 0;
  left: 0;
  border: 1px solid #ccc;
  width: 200%;
  height: 200%;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transform-origin: left top;
  transform-origin: left top;
}

 

4：在h5嵌入app中，ios如果出现垂直滚动条时，手指滑动页面滚动之后，滚动很快停下来，好像踩着刹车在开车，有“滚动很吃力”的感觉

解决方案：self.webView.scrollView.decelerationRate = UIScrollViewDecelerationRateNormal;对webview设置了更低的“减速率”

 

5：移动端click 300ms 延时响应

解决方案:使用 Fastclick

window.addEventListener( "load", function() {
  FastClick.attach( document.body );
}, false );

 

6：在安卓机上placeholder文字设置行高会偏上

解决方案:input有placeholder情况下不要设置行高

 

7：overflow:scroll，或者auto在iOS上滑动卡顿的问题

解决方案:加入-webkit-overflow-scrolling:touch;

 

来源：https://www.cnblogs.com/panrui1994/p/11690094.html