标签：
今天要实现一个效果：点击图片后弹出一个浮层，该浮层内容比较多，设置overflow:auto;希望浮层滚动的时候，底层的页面是不动的。在网上查了很多，都没有找到解决方案，有人在问，但是并没有人回答。所以特地跑去问了师傅，在这里分享一下，希望遇到同样问题的小白，可以有所帮助。
首先，把底层页面放在一个div中，包起来，设置它的css样式：
1 #main{ 2 position: fixed; 3 width: 100%; 4 top:0; 5 height:100%; 6 z-index:1; 7 overflow: auto; 8 }
（其中，z-index的值根据自身情况设定。）
然后，把要弹出的浮层也放在一个div中，并为其设置css样式：
1 #Tan{ 2 position: fixed; 3 width: 100%; 4 top:0; 5 display:none; 6 height:100%; 7 z-index: 2999; 8 overflow: auto; 9 }
（同样，z-index值根据自身情况设定）
最后，就是js代码部分：
1 document.getElementById(floatLayer).addEventListener(‘DOMMouseScroll‘,function(event){ 2 3 event.stopPropagation(); 4 5 },false);
给弹出层添加一个滚轮事件 DOMMouseScroll
剩下的就是用javascript设置页面的display，实现页面的出现和消息。
标签：
原文地址：http://www.cnblogs.com/hsprout/p/5463184.html
