滚动穿透

滚动穿透

Fri Jul 01

Author: huyikai

滚动穿透css

前端开发中经常遇到弹窗场景，往往会遇到弹窗后，底层内容扔会滚动的显示问题。

之前会通过给 body 添加 overflow:hidden 或者添加 position:fixed, 但是页面会回到顶部或者弹窗的滚动也被禁止掉了。

现在我们可以通过 body-scroll-lock 这个库来解决这个问题。

安装

Terminal window
yarn add body-scroll-lock

Usage

import {
  disableBodyScroll,
  enableBodyScroll,
  clearAllBodyScrollLocks
} from 'body-scroll-lock';


//disableBodyScroll(ref)
//enableBodyScroll(ref)
//clearAllBodyScrollLocks(ref)