Customizable New Browser Window Plugin - jQuery Window Popup

Window Popup is a jQuery plugin which displays external links in a new browser window with lots of customization options.

Based on the Window​.open() API to load the specified webpage into the browsing context.

Features:

• Custom width/height.
• Custom position.
• Custom placement.
• Shows/hides status, menu, location, toolbar, scrollbar, etc.
• Enables/disables fullscreen & chanel modes.

How to use it:

1. To get started, load the minified version of the jQuery Window Popup plugin after jQuery (slim build is recommended).

<script src="/path/to/jquery.slim.min.js"></script>
<script src="./dist/jquery-window-popup.min.js"></script>

2. Initialize the plugin on trigger links and done.

<a class="winpopup" href="https://google.com">Launch The Popup</a>

$(function(){
  $('.winpopup').winpopup();
});

3. Or attach the function to an trigger element and specify the URL & window name in the JavaScript:

<a class="winpopup">Launch The Popup</a>

$(function(){
  $('.winpopup').winpopup({
    url: 'https://www.jqueryscript.net',
    name: 'jquery window popup'
  });
});

4. To customize the plugin, I highly recommend you to pass the options to the data-winpopup attribute:

<a class="winpopup" 
   href="https://google.com" 
   data-winpopup='{"name":"toolbar","toolbar":1}'>
   Launch The Popup 
</a>

5. You can also pass the options to the winpopup function on init. All default options:

$('.winpopup').winpopup({

  // url to open
  url: 'https://google.com',

  // window name
  name: 'jquery window popup',

  // width/height
  width: 640,
  height: 640,

  // top/left offsets
  top: 0,
  left: 0,

  // shows/hides elements
  // 1 = show; 0 = hide
  status: 0, 
  menubar: 0,
  location: 0,   // Opera only
  toolbar: 0,   // IE, Firefox only
  scrollbars: 0,   // IE, Firefox & Opera only
  resizable: 0,   // IE only
  channelmode: 0,   // IE only
  fullscreen: 0,   // IE only
  titlebar: 1, 

  // 'top-left', 'top-center', 'top-right', 'middle-left', 'middle-center', 'middle-right', 'bottom-left', 'bottom-center', 'bottom-right'
  alignment: 'middle-center' 

});

---

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