Tous nos scripts

Modal & Popup

Afficher une Exit Popup

<script>
const mouseEvent = (e) => {
  if (!e.toElement && !e.relatedTarget) {
    document.removeEventListener('mouseout', mouseEvent);
    document.querySelector('[js-modal-element=exit]').style.display = 'flex';
  }
};

document.addEventListener('mouseout', mouseEvent);
</script>

Etape 1 - Ajouter le script sur la page ou le projet Webflow

<!-- Scripts by Justa | Exit Popup -->
<script src="https://cdn.jsdelivr.net/npm/@justaa/scripts/dist/modal/exit.js"></script>
<script>
const mouseEvent = (e) => {
  if (!e.toElement && !e.relatedTarget) {
    document.removeEventListener('mouseout', mouseEvent);
    document.querySelector('[js-modal-element=exit]').style.display = 'flex';
  }
};

document.addEventListener('mouseout', mouseEvent);
</script>
Copier

Etape 2 - Ajouter les attributes correspondants

Div - Identifier la Modal

Nom

js-modal-element

Valeur

exit

Ajouter l'attribute à votre modale component (qui comprennent le cotenu, l'overlay et le bouton de fermeture)

Nom

Copié !

Valeur

Copié !

Nom

Valeur

Nom

Valeur

Nom

Valeur

Nom

Valeur

Nom

Valeur

Tuto, template & scripts

Tuto

Template

Script

<script>
const mouseEvent = (e) => {
  if (!e.toElement && !e.relatedTarget) {
    document.removeEventListener('mouseout', mouseEvent);
    document.querySelector('[js-modal-element=exit]').style.display = 'flex';
  }
};

document.addEventListener('mouseout', mouseEvent);
</script>
Copier

Etape 2 - Ajuster le code pour votre besoin

Copié dans le presse-papiers
Logo Justa

Progressez sur Webflow

Oops! Une erreur s'est produite lors de la soumission du formulaire.