Como adicionar evento de saída em Popup do Elementor no Mobile

Picture of Ivon Filho

Ivon Filho

Procurando desenvolvedor freelancer para seu projeto?

Para bloquear o botão “voltar” do navegador e abrir um popup quando o usuário tenta sair da página, você pode usar uma combinação de JavaScript e manipulação do histórico do navegador. Aqui está um exemplo de como você pode fazer isso:
<script>
function abrirPopup() {
    var botao = document.getElementById('abrir-popup');
    if (botao) {
        botao.click();
    }
}

window.addEventListener('load', function() {
    // Adiciona uma entrada falsa ao histórico
    history.pushState({ prevUrl: location.href }, '');
    window.onpopstate = function(event) {
        history.go(1);
        abrirPopup();
        // Adiciona novamente uma entrada ao histórico
        history.pushState({ prevUrl: location.href }, '');
    };
});
</script>
Segundo código para permitir saída após apenas um clique no botão voltar do mobile:
<script>
let contadorSaida = 0;

function abrirPopup() {
    var botao = document.getElementById('abrir-popup');
    if (botao) {
        botao.click();
    }
}

window.addEventListener('load', function() {
    // Adiciona uma entrada falsa ao histórico
    history.pushState({ prevUrl: location.href }, '');
    window.onpopstate = function(event) {
        if (contadorSaida < 2) {
            history.go(1);
            abrirPopup();
            contadorSaida++;
            // Adiciona novamente uma entrada ao histórico
            history.pushState({ prevUrl: location.href }, '');
        }
    };
});
</script>
Em seguida inserimos um botão que dispara o evento de saída:
<a href="#" id="abrir-popup" style="display:none">Esconder Botão</a> 
Rolar para cima
😒
Daqui você não escapa!