Create Non-intrusive Popunder Ads Using The Popunder Plugin
File Size: | 50.9 KB |
---|---|
Views Total: | 281 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Nowadays popunder ads are a very popular form of interactive advertising since they don't interfere with your website functions or layout.
A popunder is defined as a non-intrusive window which opens behind the currently active window while the user is browsing a website. |
Here is a lightweight yet fully customizable jQuery popunder plugin that can be used to show ads, promote a subscription, or just to open a new page under the browser tab that's currently in use. Enjoy it.
How to use it:
1. Load jQuery and js-cookie (used for blocking popunders) libraries in the document.
<!-- Required --> <script src="/path/to/cdn/jquery.slim.min.js"></script> <!-- Optional --> <script src="/path/to/cdn/js.cookie.min.js"></script>
2. Download and load the jQuery Popunder plugin after jQuery.
<script src="dist/jquery.popunder.min.js"></script>
3. Open a popunder via button click.
<form id="test" action="https://www.google.com" method="GET"> <input type="hidden" name="q" value="jquery-popunder" /> <input id="submitButtonOneClick" type="submit" value="Open Popunder via Button-Click" /> </form>
window.fPopunder = function(event) { if (!window.fPopunderStack) { window.fPopunderStack = [ ['https://www.bing.com'] ]; } return window.fPopunderStack; }; $.popunder(window.fPopunder, '#test', '#test input[type="submit"]');
4. Open multiple popunders at a time.
window.aThreePopunder = [ ['https://www.github.com', {window: {height:400, width:400}, blocktime: 1}], ['https://www.bing.com', {window: {height:100, width:100}, cb: function() { console.log('bing.com has been opened'); }}], ['https://www.google.com'] ]; $.popunder(window.aThreePopunder, '#test', '#test input[type="submit"]');
5. Open multiple popunders at a time.
window.aThreePopunder = [ ['https://www.github.com', {window: {height:400, width:400}, blocktime: 1}], ['https://www.bing.com', {window: {height:100, width:100}, cb: function() { console.log('bing.com has been opened'); }}], ['https://www.google.com'] ]; $.popunder(window.aThreePopunder, '#test', '#test input[type="submit"]');
6. Open a popunder via a normal link.
<a href="#" onclick="$.popunder(this)">Open Popunder via Link</a>
window.aPopunder = [ ['https://www.bing.com'] ];
This awesome jQuery plugin is developed by hpbuniat. For more Advanced Usages, please check the demo page or visit the official website.