移动端如何禁用底层的滚动事件，保证弹出层的滚动事件正常运行

今天做移动端项目时遇到的一个问题，带来了不少麻烦。

pc端的常用方法是 ：

$('body').css({    overflow: 'hidden',    height: $(window).height() + 'px'})// 因为body的高度等于了window的高度,所以滚动自然就无法进行了,如果需要滚动了,只需要把高度从style标签上面移除就好了

但在移动端是不生效的，这个也是大家说的滚动穿透问题：

百度了很多大神的Demo终于会走到解决方法：下面是个人项目部分代码

-----------css------------

.modal-open{    position: fixed;    width: 100%;}

-------------js-----------

 //产品弹出详情页    $('.pro').each(function () {//        console.log(this);        $(this).on('click', function () {            $('#maskbody').fadeIn();            scrollTop = document.scrollingElement.scrollTop;            $('body').addClass('modal-open');            document.body.style.top = -scrollTop + 'px';        });    });    $('#colse').on('click',function () {        $('#maskbody').fadeOut();       $('body').removeClass('modal-open');        document.scrollingElement.scrollTop = scrollTop;    })

更多可以参考一下链接：

https://uedsky.com/demo/modal-scroll.html