汇集移动端兼容性问题

1、一些情况下对非可点击元素如(label,span)监听click事件，ios下不会触发

css增加cursor:pointer

2、三星手机遮罩层下的input、select、a等元素可以被点击和focus(点击穿透)

发现于三星手机，这个在特定需求下才会有，因此如果没有类似问题的可以不看。首先需求是浮层操作，在三星上被遮罩的元素依然可以获取focus、click、change)，有两种解决方案，
1.是通过层显示以后加入对应的class名控制，截断显示层下方可获取焦点元素的事件获取
2.是通过将可获取焦点元素加入的disabled属性，也可以利用属性加dom锁定的方式（disabled的一种变换方式）

3、当输入框在最底部，点击软键盘后输入框会被遮挡　　

var oHeight = $(document).height(); //浏览器当前的高度   
   $(window).resize(function(){
 
        if($(document).height() < oHeight){
         
        $("#footer").css("position","static");
    }else{
         
        $("#footer").css("position","absolute");
    }
        
   });

4、禁止 iOS 弹出各种操作窗口

-webkit-touch-callout:none

5、消除 transition 闪屏

-webkit-transform-style: preserve-3d;     /*设置内嵌的元素在 3D 空间如何呈现：保留 3D*/
-webkit-backface-visibility: hidden;      /*(设置进行转换的元素的背面在面对用户时是否可见：隐藏)*/

6、阻止旋转屏幕时自动调整字体大小

html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {-webkit-text-size-adjust:none;}

7、iOS6下伪类:hover除了<a>之外的元素无效；在Android下则有效

div#topFloatBar_l:hover #topFloatBar_menu { display:block; }
//这样的导航显示在iOS6点击没有点击效果，只能通过增加点击侦听器给元素增减class来控制子元素。

8、在移动端修改难看的点击的高亮效果，iOS和安卓下都有效

* {-webkit-tap-highlight-color:rgba(0,0,0,0);}
//不过这个方法在现在的安卓浏览器下，只能去掉那个橙色的背景色，点击产生的高亮边框还是没有去掉，有待解决！

//webkit是苹果浏览器引擎，tap点击，highlight背景高亮，color颜色，颜色用数值调节。

原因如下：

在移动端上，有事件监听的元素被点击的时候会被高亮显示，而-webkit-tap-highlight-color属性会在当用户点击iOS的Safari浏览器中的链接或JavaScript的可点击的元素时，覆盖显示的高亮颜色。

该属性可以只设置透明度。如果未设置透明度，iOS Safari使用默认的透明度。当透明度设为0，则会禁用此属性；当透明度设为1，元素在点击时不可见。

9、相对于底部绝对定位的按钮被键盘顶起来，用js定高

this.clientHeight = document.documentElement.clientHeight;
$('body').height(this.clientHeight);

10、Android点击按钮什么的时候,总是出现一个焦点的光标在页面上，去掉该光标

body {
    -webkit-user-select: none;
}

11、禁止复制、选中文本

Element {
  -webkit-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
   user-select: none;
}

12、IOS键盘字母输入，默认首字母大写

<input type="text" autocapitalize="off" />