IE浏览器滚动条与悬浮层的问题

问题

• 问题场景出现在angular overlayer悬浮层，当悬浮层底部的dom结构处于正常的文档流中时，并存在滚动条，这个时候悬浮层内会出现一个奇异的bug现象：
• 当悬浮层父级处于文档流，但内容由于布局，脱离了文档；
• 悬浮层内容由于脱离了根文档，所以会产生属于自己的滚动条；
• 当根文档出现了滚动条，悬浮层也出现了文档流，这个时候现象就出现了
• 悬浮层出现后，只要鼠标移动出悬浮层的内容范围，就会快速的闪现一下

解决办法

这里提供两种
1，把悬浮层最底层的滚动设置为scroll；
因为当鼠标移出悬浮层的可是内容区域后，ie浏览器监听到了鼠标移入了底部的文档，那么会对文档进行一次重新渲染，这个时候正常文档流内的部分就会移入视野；那我们只需要把鼠标移出这个动作不要冒泡到根文档即可；所以scroll设置为scroll，就可以让鼠标移动固定在悬浮层内；
2，清除浮动
把悬浮层外容器会处于文档结构之中，那么对悬浮层内清除浮动，并通过scroll隔断鼠标事件那这样就可以把悬浮层对文档的影响隔断；
这里用伪元素展示一下；

:after {
content:' ';
display:block;
overflow:scroll;
clear:both;
}

总结

IE浏览器是一个很神奇的东西，有很多需要探索的地方；
包括css3如何在ie浏览器中做出兼容性效果，都需要一点点去研究；