开发H5遇到的问题集合

iPhone手机scroll滑动不顺滑

div固定高度，子元素可滚动，设置overflow:scroll，但是在iPhone中发现滑动不顺滑，解决办法只需要在此div上加一句：

-webkit-overflow-scrolling : touch;

使用jQuery绑定元素点击事件不生效

使用jQuery为div元素绑定事件后，在Android平台上可以触发点击事件，在Chrome调试也可以触发，但是在iPhone上无法触发
举个例子：

<div class="name">点我</div>
$(document).on("click", ".name", function() {
    alert("name");
});

以上代码在电脑浏览器和安卓上都能触发alert事件，但是在iOS上没有任何反应，原因是在iOS上没有click事件，是touch事件，有两种解决办法
1，给修改此元素的CSS

.name{
    cursor:pointer
}

2，上述方法如果你觉得粗暴，可以将click改为touchstart事件，或者共存

$(document).on("click touchstart","name",function(){
   alert('name')
})

注：个人觉得滑动页面的时候touchstart会误触，还是喜欢用click + cursor

元素垂直居中

垂直居中最方便的是使用flex布局，因为在微信浏览器中，苹果手机微信浏览器在第一次跳转时候会增加一个底部条用来页面后退和前进。所以在使用定位的时候往往显示不够准确，例如基于底部的固定高度的定位的元素，尤其是很多手机屏幕高度不一样。如果使用flex布局尤其是在元素居中上，几乎会适应所有屏幕，看起来更加协调。