当网页中有遮罩时，如何禁止背景元素滚动

很多自适应的主题，在手机端都是选择把菜单栏隐藏在侧面，按需调用。调用的时候往往页面会显示一个遮罩，屏蔽掉了其他不相关元素的点击，但遮罩上即便设置了overflow属性，也无法阻挡背景body自由翻滚的热情。

这个时候可以考虑给body临时加上一个overflow:hidden属性，这样一来，body会把超出页面的内容暂时屏蔽，无法出现滚动条，自然也就实现滚动动作了。

实现方法比较简单，可以考虑用js给body添加一个临时的pause类，遮罩关闭后则立即移除，以恢复body的正常滚动：

.pause{
    overflow: hidden;
}

优点

遮罩出现后屏蔽滚动，符合正常的思维逻辑，如果原页面有滚动条，滚动条也会一并消失，遮罩页效果看起来更为统一。

缺点

PC端滚动条的消失与出现，会引起页面的少许位移，遮罩透明度较高的情况下，这个位移也尤为明显。