那些遇到的position-fixed无效事件
本篇文章由：http://xinpure.com/position-fixed-encountered-an-invalid-event/
第一次无效事件
事件主角: transform
应用环境: Chrome/FireFox
事件回顾:
这是在使用 iscroll js滚动库的时候，遇到的问题
当时的需求是需要在滚动到一定的距离的时候，将一个 tab 列表固定到顶部，不随页面滚动
固定定位元素嘛，小事！我们知道这是一个非常普通的需求，实现方式也比较简单，那就是使用 position: fixed 就可以将元素固定到浏览器的指定位置了
而我也照做了，令人无语的是，完全没有效果？！ (仅仅只是 position: absolute 的效果)
后来经过一番调试之后，发现是因为父元素有一个 transform 属性，导致了这个问题的出现。
因为 iscroll 是基于 transform 属性实现滚动的, 所以 iscroll 会通过实时修改元素的 transform 属性以达到滚动的效果
也就是说，只要父元素如果存在 transform 属性，子元素的 position: fixed 属性无效。
Google:
https://bugs.chromium.org/p/chromium/issues/detail?id=20574
"position: fixed" still do not cope with transform value
这个解释好有道理！
链接中也有提到说给子元素添加 -webkit-transform: translateZ(0); 就可以解决这个问题
我只能说亲测无效！
百度:
http://www.zhangxinxu.com/wordpress/2015/05/css3-transform-affect/
第二次无效事件
事件主角: -webkit-overflow-scrolling
应用环境: 手机Web应用
事件回顾:
在 Mobile Web 开发中，用户体验是个非常重要的点。
所以像平滑滚动的特性是少不了的，通常会使用 -webkit-overflow-scrolling 实现这一效果
该属性控制元素在移动设备上是否使用滚动回弹效果。
-webkit-overflow-scrolling: touch; /* 当手指从触摸屏上移开，会保持一段时间的滚动 */
-webkit-overflow-scrolling: auto; /* 当手指从触摸屏上移开，滚动会立即停止 */不巧，这次我又有个将元素设置成 position: fixed 的需求
在有上次的经历(transform)后，并没有让我长什么记性，不过说实话，position 这原本就是一个特别简单的一个属性，又怎么会。。。
只能说话音刚落，瞬间就蒙逼了！又是无效！心中草泥马纵横交错！
最后也是发现，只要父元素的 -webkit-overflow-scrolling 属性值为 touch，子元素的 position: fixed 属性就无效。
Google:
百度:
Not Found
