DEV Community

Cher
Cher

Posted on

Disabling click events outside of your popup

Never inject an overlay div again (unless you want to 😉).

useLayoutEffect(
    () => {
      const {current: menuDOM} = menuRef;
      const body = window.document.querySelector('body');
      if (menuDOM && isOpen) {
        body.style['pointer-events'] = 'none';
        menuDOM.style['pointer-events'] = 'initial';
      } else if (menuDOM && !isOpen) {
        body.style['pointer-events'] = null;
        menuDOM.style['pointer-events'] = null;
      }
    },
    [isOpen]
  );
Enter fullscreen mode Exit fullscreen mode

Top comments (0)