标签：ios设备 遇见 rgb img ... scrolling alt bsp 键盘
从去年开始在公司一直做嵌入式的h5页面，遇见了很多问题，做一个小小的总结~
在傲娇的iOS中可点击元素被点击时候会出现覆盖显示的高亮颜色，也就是一个灰色的阴影，特别难看，尤其是在元素占地面积还比较大的时候。这个可以通过
这个css属性来设置，你可以改成任何你想要的颜色，也可以去掉。
-webkit-tab-highlight-color:rgba(0,0,0,0);
//去掉背景高亮
-webkit-tab-highlight-color: red;
//设置背景高亮的颜色
什么叫跳动，就是你上滑的fixed定位的部分会跟着你一起上滑，滑动结束的时候又会弹回到定位的位置，领导看见了也没骂我，一本正经跟我讲，你这个效果有点炫啊，用户体验满分，（手动尴尬）。。。
根据我（用户体验满分）的经验，移动端尽量不要用fixed定位，在ios中会出现很多乱七八糟的效果，比如令人痛心疾首的键盘弹出，就会给你顶个底朝天！那怎么解决呢，产品经（jian）理（ren）的效果还是要实现呀，我目前觉得最好的解决办法就是全部使用position:absolute（欢迎探讨）
一般h5页面常用布局都差不多是这样
那怎么用absolute实现fixed的效果呢，好，老夫开始炫技了#_#
1 //首先是html 2 <body> 3 <div class=‘header‘>header</div> 4 <div class=‘main‘>main</div> 5 <div class=‘footer‘>footer</div> 6 </body>
//css .header{ width:100%; height:100px; position:absolute; left:0; top:0; } .footer{ width:100%; height:100px; position:absolute; left:0; bottom:0; } .main{ width:100%; position:absolute; left:0; right:0; top:100px; bottom:100px; //这两句是关键 }
所有的滑动部分就放在中间的main中，完美，-_-#
这样用的是很爽，但是很多小伙伴试了之后肯定又被产品怼了，你这个滑动效果不行啊，怎么有时候一卡一卡的！不可能，老夫写的东西怎么会.....额，还真的一卡一卡的...
怎么才能像原生一般丝滑呢？？？就有另外一个css属性了
-webkit-overflow-scrolling: touch; /* 当手指从触摸屏上移开，会保持一段时间的滚动 */ -webkit-overflow-scrolling: auto; /* 当手指从触摸屏上移开，滚动会立即停止 */
当然是选择 -webkit-overflow-scrolling: touch; 就是这么丝滑~
先写到这里吧，剩下的就下一篇吧......
标签：ios设备 遇见 rgb img ... scrolling alt bsp 键盘
原文地址：http://www.cnblogs.com/th666/p/7530906.html
