DEV Community

Cher
Cher

Posted on

3 1

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)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs