Exit Intent Mobile Pop Up!

Pro Tips Elfsight Widgets Tips
19

Hi @Ingrid_van_Waard :wave:

Yeah, unfortunately the video is currently not available, but the solution is still here!

Just enable the Exit Intent trigger, add the script below to the Custom JS field and you’ll witness the magic :wink:

image
image396×796 17.7 KB
image
image398×841 17.9 KB

// Function to show the Elfsight widget using the provided API method
function showElfsightPopup() {
  if (typeof widget !== 'undefined' && widget.show) {
    widget.show();
  }
}

// Variables to track scroll position
let lastScrollTop = window.pageYOffset || document.documentElement.scrollTop;
let scrollThreshold = window.innerHeight * 0.35; // 35% of the viewport height

// Detect upward scrolling
window.addEventListener("scroll", function() {
  let currentScroll = window.pageYOffset || document.documentElement.scrollTop;
  if (lastScrollTop - currentScroll > scrollThreshold) {
    showElfsightPopup();
  }
  lastScrollTop = currentScroll <= 0 ? 0 : currentScroll;
}, false);

// Detect back button press on mobile
window.addEventListener("popstate", function() {
  showElfsightPopup();
});

// Push a new state into the history to enable back button detection
history.pushState(null, null, window.location.href);

// Detect beforeunload event
window.addEventListener("beforeunload", function() {
  showElfsightPopup();
});

// Detect pagehide event
window.addEventListener("pagehide", function() {
  showElfsightPopup();
});

// Detect visibility change event
document.addEventListener('visibilitychange', function() {
  if (document.visibilityState === 'hidden') {
    showElfsightPopup();
  }
});
2 Likes