All comments

• 

  Emil•60

  @ejoseph89Submitted over 2 years ago

  Any suggestions on adding a feature to close the menu on clicking/tapping outside of the menu?

  

  Responsive landing page using React

  1

  40
  

  Hudaifa•50

  @trafargarlawPosted over 2 years ago

  Hey, for closing the menu when you click or tap outside of it, since you're using react you could make a custom hook "useClickOutside" for example that takes a ref object of the menu and a handler as parameters it would look something like this : export const useClickOutside = ( ref: React.RefObject<HTMLElement>, handler: () => void ) => { useEffect(() => { const listener = (event: MouseEvent) => { if (!ref.current || ref.current.contains(event.target as Node)) { return } handler() } document.addEventListener('mousedown', listener) return () => { document.removeEventListener('mousedown', listener) } }, [ref, handler]) }

  0