弹窗查看内容时 内容滚动区域设置为body区

弹窗查看内容时 内容滚动区域设置为body区

 

看到渣浪的查看文章或者查看大图有个效果：弹窗查看内容时，如果内容过长有滚动条，则滚动条会被放到body区滚动

什么意思呢？

看个图片，一般正常弹窗是有宽高限制的，如果内容过长则直接在弹窗中进行滚动

点我预览

 

 

将滚动位置放到整个body中，让弹窗中内容自适应高度

这么做的好处自然很明显，body区域有更大的可视区域，来看看最后的效果

点我预览

 

 

那具体是怎么实现呢

其实不算很难，各位看官可以先想一想能怎么搞

首先，得先弄一个基本的弹窗逻辑，为了简单，就直接操作了。可以自行封装

写个HTML结构

<button class="show-big-img" data-h="300">查看大图 h300</button>
<button class="show-big-img" data-h="3000">查看大图 h3000</button>


<div class="layer-shade"></div>
<div class="layer-wrap">
    <a href="javascript:;" class="layer-close">&times;</a>
    <div class="layer-content">
        <p class="show-