Skip to content

Commit

Permalink
Improved exit intent detection
Browse files Browse the repository at this point in the history
- Popup no longer triggers when mouse is within 50px of the right edge of the viewport. This fixes scrollbar issues.
- Popup now only triggers when mouse has exited the viewport within a 50px margin from the top of the viewport.
  • Loading branch information
beeker1121 committed Jan 26, 2017
1 parent 4e8b036 commit 7086924
Show file tree
Hide file tree
Showing 2 changed files with 27 additions and 35 deletions.
48 changes: 20 additions & 28 deletions js/bioep.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,6 @@ window.bioEp = {
shown: false,
overflowDefault: "visible",
transformDefault: "",
mouse: {
curY: 0,
lastY: 0
},

// Popup options
width: 400,
Expand Down Expand Up @@ -224,36 +220,32 @@ window.bioEp = {

// Load event listeners for the popup
loadEvents: function() {
// Track mouse movement.
this.addEvent(document, "mousemove", function(e) {
e = e ? e : window.event;
this.mouse.curY = e.pageY;
}.bind(this));

// Store the last Y position of the mouse every 350 ms.
window.setInterval(function() {
this.mouse.lastY = this.mouse.curY;
}.bind(this), 350);

// Track mouseout event on document
this.addEvent(document, "mouseout", function(e) {
e = e ? e : window.event;

// If this is an autocomplete element.
if(e.target.tagName.toLowerCase() == "input")
return

// If the current mouse Y position is less than the last
// mouse Y position, show the pop up.
//
// This should be enough to signify exit intent.
if(this.mouse.curY < this.mouse.lastY) {
// Reliable, works on mouse exiting window and
// user switching active program
var from = e.relatedTarget || e.toElement;
if(!from)
bioEp.showPopup();
}
return;

// Get the current viewport width.
var vpWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);

// If the current mouse X position is within 50px of the right edge
// of the viewport, return.
if(e.clientX >= (vpWidth - 50))
return;

// If the current mouse Y position is not within 50px of the top
// edge of the viewport, return.
if(e.clientY >= 50)
return;

// Reliable, works on mouse exiting window and
// user switching active program
var from = e.relatedTarget || e.toElement;
if(!from)
bioEp.showPopup();
}.bind(this));

// Handle the popup close button
Expand Down
14 changes: 7 additions & 7 deletions js/bioep.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 7086924

Please sign in to comment.