All comments

• 

  seruaJ• 230

  @FaideJaures

  Submitted about 2 years ago

  Cool challenge. I would like to know how to make the hidden menu and the cart disappear if you click outside. If you have something to say, tell me, the comments are here, thanks.

  

  flexbox, vanilla js

  1

  30

  

  isaac sakyi• 260

  @isaac-svg

  Posted almost 2 years ago

  To close the modal when you click outside, add an event listener on the parent element and check if the element click contains the class class you gave to the parent. If it contains that class then you remove the class that shows the modal

  EXAMPLE CODE

  const removeModal = (e) => {

  if (e.target.classList.contains("modal")) {

  e.target.classList.remove("modal");

  }

  if (e.target.classList.contains("modal-close")) {

  imagesContainer.classList.remove("modal");

  }

  };

  END OF CODE

  So you have to invoke this function anytime a user clicks on an element you desire that it closes a modal . You can keep on with the conditionals.

  Marked as helpful

  1