h5移动端弹框出现后禁止页面滚动

在写带有弹窗时，弹窗出现时，弹框后面的页面依然会保持滚动状态，我想禁止页面滚动。我发现在body上面添加了overflow:hidden也并没有作用

最后发现我们可以这样

html {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
body {
    width: 100%;
    height: 100%;
    overflow: auto;
}

.overFlow{

overflow: hidden;

}

然后点击出现弹窗的时候。

$("body").addClass("overFlow");

弹窗关闭

$("body").removeClass("overFlow");