Simple Themable Dialog Popup Plugin For jQuery - basicPopup

A basic jQuery popup plugin used to display a responsive, fullscreen, full styleable and ajax-enabled dialog/modal box on your web project.

How to use it:

1. Include the core stylesheet and a CSS theme of your choice on the web page.

<link href="css/basicPopup.css" rel="stylesheet">
<!-- <link href="css/basicPopupDark.css" rel="stylesheet"> -->
<!-- <link href="css/basicPopupClear.css" rel="stylesheet"> -->
<link href="css/basicPopupDefault.css" rel="stylesheet">

2. Create the Html content to display in the popup window.

<div id="popup-content">
  ...
</div>

3. Make it hidden on page load.

#popup-content { display:none;

4. Create an Html element to toggle the popup window.

<button id="btn-open">Click me</button>

5. Display the popup window once you click on the toggle button.

$('#btn-open').click(function(){  
  
  $.basicpopup({
    content: $('#popup-content').html()
  });
  
});

6. Available options.

$.basicpopup({

// load remote content via ajax
url: '',

// custom popup content
content: '',

// display close button
btnClose: true,

// addional CSS class for the popup
mainClass : '',

// callback function
afterShow: false

});

---

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