项目问题备忘之IE6、IE7父元素滚动，子元素不跟随滚动bug和点击穿透bug

由于所做项目要求兼容IE7以上浏览器，所以遇到了2个IE7浏览器的问题，好在网上一搜就能找到答案，不得不感谢这些前端前辈们留下的痕迹，方便小菜学习。

 

问题1描述：

在IE6,IE7下，子元素使用position:relative、父元素或者祖先元素了使用overflow:auto后，我们预期的是滚动条滚动时，子元素也应该随之滚动，实际情况是这些设置了position:relative的内容不滚动，而当鼠标划过时，它又跑到了该在的地方。

办法：起初我以为是浏览器渲染的问题，后来google搜了一下，找到了答案，解决办法就是将设置了overflow:auto的元素加上相对定位(positon:relative;)即可。

 

问题2描述：

在IE7浏览器下，设置了蒙层的透明背景色，例如：background: rgba(244,219,187, 0.6);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99F4DBBB, endColorstr=#99F4DBBB);而被蒙层遮挡的按钮还是可以点击的。

办法：解决方案就是将蒙层的背景色切成了1px*1px像素的图片，然后将其设为蒙层的背景图片即可。

 

项目做完留点笔记，方便备忘和学习，希望有其他思路小伙伴交流学习。