How to close popup by clicking on gray background / overlay? | Community
Skip to main content
Question

How to close popup by clicking on gray background / overlay?


Is it possible to customize the popup so that it closes by clicking on the grey background / overlay next to the popup? Currently it can only be closed via the X button, but users also like to simply click on the background next to the survey to close it.

Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • August 2, 2024

Hi @MarcB Thanks for stopping by the community! While our builder doesn’t offer an option to customize this, you could take a look at our Embed SDK to see if you’d be able to use this with your own custom code. 😀


  • Explorer
  • August 5, 2024
Liz wrote:

Hi @MarcB Thanks for stopping by the community! While our builder doesn’t offer an option to customize this, you could take a look at our Embed SDK to see if you’d be able to use this with your own custom code. 😀

Hi @Liz , thanks for your answer. I had already looked there, but couldn't find a suitable solution. I was therefore hoping that someone here might be able to help me with a possible solution.


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • August 5, 2024

Tagging @picsoung in case he has any ideas!


  • Explorer
  • August 19, 2024

I have found a solution, maybe it is also interesting for others in the community:

    document.addEventListener('click', function(event) {
  if (event.target.classList.contains('tf-v1-popup')) {
    // Schließe das Popup
    event.target.style.opacity = 0;
        event.target.style.display = 'none';

    // Entferne overflow: hidden vom body
    document.body.style.removeProperty('overflow');
  }
});


  


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • August 22, 2024

Thanks so much for sharing this, @MarcB !


Reply