半透明遮罩层覆盖整个可视区域

我们经常会遇到点击一个按钮弹出一个对话框和一个变暗的遮罩层，简单的写法只能让遮罩层覆盖浏览器的大小，那么怎么让遮罩层覆盖全部区域呢？

css代码如下：

html,body {
    height: 100%;
    margin: 0;
    padding: 0;
}
.mask {
    height: 100%;
    width: 100%;
    position: fixed;
    _position: absolute;
    top: 0;
    z-index: 100;
}
.opacity {
    opacity: 0.3;
    filter: alpha(opacity=30);
    background: #000;
}