Cookie-enabled Exit Popup Window Plugin With jQuery - ysExitPopup

File Size: 11.6 KB
Views Total: 8706
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Cookie-enabled Exit Popup Window Plugin With jQuery - ysExitPopup

ysExitPopup is a really simple jQuery exit modal plugin that shows a cookie-enabled modal popup when your cursor moves out of view. Useful to create a confirm dialog asking the users to confirm if they want to quit your webpage.

See also:

How to use it:

1. Include the ysExit.css for the basic styles of the exit modal.

<link rel="stylesheet" href="css/ysExit.css">

2. Add custom content to the exit modal.

<div class="demo">
<div class="ys-container" id="ys-container">
  <div class="ys-box">
    <a class="ys-popup-close" href="#">x</a>
    <div class="ys-popup-content">
        <!-- Put your content here -->
        <a href="#" class="ys-exit">Exit</a>
    </div>
  </div>
</div>
</div>

3. Include jQuery library the ysExit.js at the bottom of the webpage.

<script src="//code.jquery.com/jquery-1.12.1.min.js"></script>>
<script src="js/ysExit.js"></script>

4. Initialize the plugin and done.

$('.demo').ysExit();

5. All default options.

$('.demo').ysExit({

  //popup width
  width: '40%', 

  //popup height
  height: '30%', 

  //popup selector
  target: '#ys-container', 

  //days
  cookieValidity: 1, 

  //close popup if user clicks outside
  closeOnOutsideClick: true, 

  //delay in ms until the popup is registered
  delay: 0, 

  //if true, the cookie will not be set
  debug: false,

  // custom cookie name
  cookieName: 'ysExit'
  
});

Change log:

2017-01-25

  • Allow option for custom cookieName.

2016-03-24

  • cookie name update

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