Cookie-enabled Exit Intent Popup Plugin - Stick to me

File Size: 9.07 KB
Views Total: 11791
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Cookie-enabled Exit Intent Popup Plugin - Stick to me

Just another 'Exit Popup' plugin built with jQuery Vanilla JavaScript that displays a configurable, cookie-enabled popup window when the user is about to leave the current page. 

It detects the mouse position (when it is moving up to the address bar) and then fires an event to trigger a modal popup.

See Also:

How to use it:

1. Include the stylesheet stick-to-me.css to style the exit popup.

<link rel="stylesheet" href="stick-to-me.css">

2. Add your own content to the exit popup.

<div id="stickLayer" style="display:none;" class="stick_popup">
  <div class="stick_close" onclick="$.stick_close()">X</div>
  <div class="stick_content">
    <h1>Goodbye!</h1>
  </div>
</div>

3. Include the main JavaScript file stick-to-me.js at the bottom of the webpage.

<script src="stick-to-me.js"></script>

4. Initialize the plugin to create a default exit popup when the cursor moves out of view.

document.addEventListener('DOMContentLoaded', function() {
  const stickToMeInstance = stickToMe({
    layer: '#stickLayer'      
  });
  // Add event listener to close button
  document.querySelector('.stick_close').addEventListener('click', stickToMeInstance.close);
});

5. You are able to config the exit popup with the following options.

const stickToMeInstance = stickToMe({

  // Animation speed in ms
  fadespeed: 400,

  // Where detection of exit intent takes place
  trigger: ['top'],

  // min/max time
  maxtime: 0,
  mintime: 0,

  // Delay before showing popup when exit intent is detected
  delay: 0,

  // Interval between popups
  interval: 0,

  // Maximum times the popup will be triggered  
  // 0 = unlimited
  maxamount : 0,

  // Set cookie to prevent opening again on the same browser
  cookie : false,

  // Define the cookie expiration in seconds
  cookieExpiration: 0,

  // Clickon background to close the popup
  bgclickclose : true,

  // Press ESC to close the popup
  escclose : true,

  // Chrome disable
  disableleftscroll : true,

  // Enable debug mode
  debug: false,

  // Callback function
  onleave : function (e) {},   
  
});

Changelog:

v2.0 (2024-10-19)

  • Removed jQuery dependency
  • Improved performance and maintainability
  • New Debug mode for easier troubleshooting

2021-03-18

  • Add a more professional X closer

This awesome jQuery plugin is developed by guiassemany. For more Advanced Usages, please check the demo page or visit the official website.